Klaus Hartl wrote:
Rob Desbois wrote:
Happy Friday 13th all ;-)
Just mocking up a new interface and attempting to use floated <div>s
for layout.
The right div of two floated next two each other needs to be a tabbed
container...but the tabs plugin floats the <li> elements then does a
clear:both afterwards which breaks my layout.
I have a feeling I'll be playing with it all afternoon to try and
change this, but can anyone assist and point me in the right
direction? I like the positioning as it is but just need it to not use
floats...
Thanks!
Rob, does it help if you declare float for the ul as well?
.tabs-nav {
float: left;
}
Depending on how the tabs shall look like you could also clear by
declaring overflow for the ul, like:
.tabs-nav {
overflow: hidden;
}
Works in all modern browsers except for IE 6.
But that breaks the relative positioning, e.g. pushing the active tab on
top of the bottom border (this is why I said it depends on how tabs
shall look like).
Alternatively you may declare a height for the ul and do not clear at all...
Getting around the float will be hard, although doable (via display:
inline-block, or display: table-cell)
--Klaus