如何给FlowPanel增加页边距？

Question

我使用的com.google.gwt.user.client.ui.FlowPanel窗口小部件彼此非常接近。但是，我想不出如何设置边距？

顺便说一句，也许有更好的布局？我只需要一个容器的几个锚，一个接一个地定位。

Answer 1

您可以通过以下两种编程方式来完成：

flowPanel.getElement().getStyle().setProperty("margin", "10px");

或者使用声明边距的CSS类(YourCssClassWithMargin{ margin: 10px; })：

如果使用UiBinder，则按如下方式添加->样式：

<g:FlowPanel styleName='YourCssClassWithMargin'>

如果您不以这种方式使用UiBinder，则使用->：

flowPanel.addStyleName("YourCssClassWithMargin");

Answer 2

添加了新的方法，所有属性元素都作为单独的方法。这非常方便，就像这样

`flowPanel.getElement().getStyle().setMargin(10, Unit.PX);`
`flowPanel.getElement().getStyle().setMarginLeft(10, Unit.PX);`
`flowPanel.getElement().getStyle().setMarginRight(10, Unit.PX);`
`flowPanel.getElement().getStyle().setMarginTop(10, Unit.PX);`
`flowPanel.getElement().getStyle().setMarginBottom(10, Unit.PX);`

Answer 3

最简单的方法是使用selectors CSS has。

如果你想将一个margin应用于所有Divs中的所有Anchors (一个FlowPanel是一个普通的Div)，你可以使用这个CSS：

div a {
   margin:10px;
}

如果您只想将margin应用于FlowPanel中的Anchor，则可以应用如下内容：

.FlowPanelStyle {
    margin:10px;
}

必须通过调用以下方法将FlowPanelStyle应用于FlowPanel

yourFlowPanel.addStyleName("FlowPanelStyle");