I may have figured out the cause by playing with the CSS. If anyone
else wants to confirm, or for future searches, doing this
resolved the problem:
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px;
border-bottom-width: 0; }
padding-bottom is set to 1px by default in the current download for
the selected tab. The problem seems to be that when
you select a tab in the first row, any bottom padding setting above
zero creates a space that can't be inhabited by
tabs in the second row. When that happens all tabs in the second row
are pushed to after the space created by
the bottom padding of the selected tab. Removing the padding-bottom
attribute from the selected tab settings fixes
this problem. All tabs wrap and behave normally.
Hope this helps anyone looking for a solution in the future.
On Mar 25, 12:06 am, "[email protected]"
<[email protected]> wrote:
> This topic has come up at least twice before ("Tabs wrapping problem"
> June 5th 2008 and "Tabs CSS issue" dec 2 2008) without solutions. I'm
> having the same problem: When I have a tab container where the tabs
> overflow the first row, the first tab on the second row doesn't align
> to the left. Instead It aligns to the right of the tab selected above
>
> So when you'd expect (where TAB is the currently selected tab)
>
> [tab][tab][TAB][tab][tab]
> [tab]
>
> you get
>
> [tab][tab][TAB][tab][tab]
> ____________[tab]
>
> Is there anything that can be done to reliably push the second row of
> tabs to the left?
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
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/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
