I've had success centering a FlowPanel (lets call it contentPanel) in a
FlowPanel (lets call it containerPanel).
The container panel expands to 100%:
.containerPanelStyle {
width: 100%;
height: 30px;
background-color: purple;
}
Then we can center the contentPanel easily by using css to set the left and
right margins to auto:
.contentPanelStyle {
width: 600px;
height: 30px;
margin-left: auto;
margin-right: auto;
background-color: red;
}
Cool.
However, I find myself needing to shrinkwrap (I found that some css guys
were calling it this) the FlowPanel.
By shrinkwrapping I just mean autosizing. The contentPanel will contain
things that change width throughout runtime
and I want it to remain centered within the containerPanel.
No problem. I just put 'float' in the css:
.contentPanelStyle {
height: 30px;
margin-left: auto;
margin-right: auto;
background-color: red;
float:left;
}
Yayyy. Now the contentPanel's width shrinks to match the width of its
contents (things like labels, drop down boxes).
Boooo. Now the contentPanel is left justified in the containerPanel,
ignoring the fact I've set the margins to auto.
What gives?
How do I center a FlowPanel that employs float:left in order to auto-size
itself?
David
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-web-toolkit/-/du2zoXFq5z4J.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
