CODEWITHSUNDEEP
gwt
Oleg Vazhnev
Oleg Vazhnev

Reputation: 24057

how to add margins to FlowPanel?

I'm using com.google.gwt.user.client.ui.FlowPanel Widgets are very close to each other. However I can't figure out how to set margins?

BTW probably there are better layouts? I just need a container for several Anchors that located one by one.

Upvotes: 4

Views: 7966

Answers (3)

Jess
Jess

Reputation: 425

New Methods has been added with all the property elements as separate methods. This comes very handy like

`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);`

Upvotes: 3

Chris Boesing
Chris Boesing

Reputation: 5279

The easist way would be using the selectors CSS has.

If you would like to apply a margin to all Anchors in all Divs(A FlowPanel is a normal Div) you use this CSS:

div a {
   margin:10px;
}

If you would like to apply the margin only to the Anchor in your FlowPanel you would to something like this:

.FlowPanelStyle {
    margin:10px;
}

You would have to apply the FlowPanelStyle to your FlowPanel by calling

yourFlowPanel.addStyleName("FlowPanelStyle");

Upvotes: 0

kgautron
kgautron

Reputation: 8263

You can do it either programmatically :

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

Or with a CSS class that declares a margin (YourCssClassWithMargin{ margin: 10px; }) :

-> if you use UiBinder add the CSS style this way :

<g:FlowPanel styleName='YourCssClassWithMargin'>

-> if you don't use UiBinder this way :

flowPanel.addStyleName("YourCssClassWithMargin");

Upvotes: 10

Related Questions