SimpleLayout "float:left" default styling

Hi everyone,

We’re trying to use the SimpleLayout addon to give us the most control over our layouts. This is working well for us apart from the fact that the SimpleLayout automatically adds a CSS rule for “float: left” to our CSS. This is making it impossible for us to use it when we require things inside the layout to be floated anything over than left.

Can anyone suggest a fix to this and also why it does this?

many thanks,

Rob

Hi,

If you mean the float that gets added for the .v-simplelayout class, then that should be easy to override. Just add a style name for your layout and set the float to “none”. Or if you want to revert the float from all simple layouts, just override the float property for the .v-simplelayout class. The trouble your facing is probably from the fact that the generated float rule is added as the last rule, overriding all rules with equal specificity. To overcome that use the following:


div.v-simplelayout {
   float: none;
}

or


// JAVA
layout.addStyleName("no-float");

// CSS
div.v-simplelayout-no-float {
   float: none;
}

The reason for the float is to make it wrap the contents that you place inside it. Or in other words, forcing the minimum width for the layout, so it measures it’s required width to be exactly what is placed inside it. But if you control the size and/or float yourself, you’re free to override it.