DockLayoutPanel/SimpleLayoutPanel - Css padding

[Marco]

Hello,

i have the problem that the css padding is not working for me, the margin and background-color does.

Here a simple example to show the problem. 

Has anybody an idea where the problem is?

Thx a lot

Marco

 

 

.test {

margin: 4px;

padding: 20px;

background-color: Lime;

}

 

 

public class GwtTest implements EntryPoint {

private LayoutPanel layoutPanel;

private Button btnNewButton;

private Button btnNewButton_1;

private SimpleLayoutPanel simpleLayoutPanel;

private SimpleLayoutPanel simpleLayoutPanel_1;

private HorizontalPanel horizontalPanel;

private Button btnNewButton_2;

private Button btnNewButton_3;

/**

* This is the entry point method.

*/

public void onModuleLoad() {

RootLayoutPanel rootLayoutPanel = RootLayoutPanel.get();

DockLayoutPanel dockLayoutPanel = new DockLayoutPanel(Unit.PX);

rootLayoutPanel.add(dockLayoutPanel);

dockLayoutPanel.addNorth(getSimpleLayoutPanel(), 40.0);

dockLayoutPanel.add(getSimpleLayoutPanel_1());

}

private LayoutPanel getLayoutPanel() {

if (layoutPanel == null) {

layoutPanel = new LayoutPanel();

layoutPanel.add(getBtnNewButton());

layoutPanel.setWidgetLeftWidth(getBtnNewButton(), 0.0, Unit.PX, 81.0, Unit.PX);

layoutPanel.setWidgetTopHeight(getBtnNewButton(), 0.0, Unit.PX, 28.0, Unit.PX);

layoutPanel.add(getBtnNewButton_1());

layoutPanel.setWidgetLeftWidth(getBtnNewButton_1(), 88.0, Unit.PX, 81.0, Unit.PX);

layoutPanel.setWidgetTopHeight(getBtnNewButton_1(), 0.0, Unit.PX, 28.0, Unit.PX);

}

return layoutPanel;

}

private Button getBtnNewButton() {

if (btnNewButton == null) {

btnNewButton = new Button("New button");

}

return btnNewButton;

}

private Button getBtnNewButton_1() {

if (btnNewButton_1 == null) {

btnNewButton_1 = new Button("New button");

}

return btnNewButton_1;

}

private SimpleLayoutPanel getSimpleLayoutPanel() {

if (simpleLayoutPanel == null) {

simpleLayoutPanel = new SimpleLayoutPanel();

simpleLayoutPanel.setStyleName("test");

simpleLayoutPanel.setWidget(getLayoutPanel());

}

return simpleLayoutPanel;

}

private SimpleLayoutPanel getSimpleLayoutPanel_1() {

if (simpleLayoutPanel_1 == null) {

simpleLayoutPanel_1 = new SimpleLayoutPanel();

simpleLayoutPanel_1.setStyleName("test");

simpleLayoutPanel_1.setWidget(getHorizontalPanel());

}

return simpleLayoutPanel_1;

}

private HorizontalPanel getHorizontalPanel() {

if (horizontalPanel == null) {

horizontalPanel = new HorizontalPanel();

horizontalPanel.add(getBtnNewButton_2());

horizontalPanel.add(getBtnNewButton_3());

}

return horizontalPanel;

}

private Button getBtnNewButton_2() {

if (btnNewButton_2 == null) {

btnNewButton_2 = new Button("New button");

}

return btnNewButton_2;

}

private Button getBtnNewButton_3() {

if (btnNewButton_3 == null) {

btnNewButton_3 = new Button("New button");

}

return btnNewButton_3;

}

}

[Jens]

SimpleLayoutPanel stretches its child to fill the whole area. It does so by using absolute positioning with top, left, bottom, right: 0px (see SimpleLayoutPanel.setWidget() source code).

Thats why your padding does not have any effect.

-- J.