Gwt DockLayoutPanel Styling

Question

Is there a way to remove the gap/padding between the panels in DockLayoutPanels. I couldn't find anything online on how to do that. If using CSS is the way to go, what attribute do I have to configure. I try setting padding to 0px in css, that didn't work. Thanks in advance.

Answer 1

If you want to remove the extra padding and margin of the DockLayoutPanel then you can try any one as mentioned below

CSS:

.dockpanel{
    margin: 0;
    padding: 0;
}

JAVA:

DockLayoutPanel dockLayoutPanel = new DockLayoutPanel(Unit.PX);
dockLayoutPanel.setWidth("200px");
//dockLayoutPanel.setStyleName("dockpanel");
//dockLayoutPanel.getElement().getStyle().setPaddingBottom(0, Unit.PX);
dockLayoutPanel.getElement().getStyle().setPadding(0, Unit.PX);
dockLayoutPanel.getElement().getStyle().setMargin(0, Unit.PX);

---

By default there is no extra padding and margin between its components. DockLayoutPanel fits the components as per their placement. It ignores component's preferred size.

For e.g.

• Width is ignored for the component set in north or south
• Height is ignored for the component set in the west or east.
• Rest available space is covered by center component.

If still there is any gap then do the same for other components placed inside DockLayoutPanel.