Opened 12 years ago

Closed 12 years ago

Last modified 12 years ago

#7090 closed bug (notabug)

Nested Tabs. Style rules for parent bleed over into child.

Reported by: eh Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.tabs Version: 1.8.5
Keywords: Cc:
Blocked by: Blocking:


This ticket duplicates #2489, which was closed without verification.

The basic problem is how the style rules for classes ui-tabs are written. By default, the selectors are written thus:

.ui-tabs .ui-tabs-nav { ... }

When you have nested tab sets, this means that such a rule matches both the parent .ui-tabs-nav as well as that of the child. This is the origin of the bleed over. I've verified this by manual examination in Firebug.

The fix is very simple. All that's required is to change the selectors to use the "immediate child" syntax:

.ui-tabs > .ui-tabs-nav { ... }

I've made this change in my local source, in all the rules that begin with.ui-tabs. Works just fine. It got rid of the need to make extraneous and confusing override rules.

This change requires a change in documentation to require that the relevant elements actually be immediate children of the parent. This is IIRC how all the examples are written anyway.

Change History (5)

comment:1 Changed 12 years ago by Scott González

Resolution: invalid
Status: newclosed

Child selectors can't be used as they don't work in IE 6. Furthermore, there is no requirement for the ul to be a direct child of the containing div. Lastly, there is nothing preventing you from styling nested tabs differently; you haven't even mentioned how you're trying to style the tabs. Please use the forums if you need help.

comment:2 Changed 12 years ago by eh

This issue needs a resolution in documentation, then, by simply stating that nested tabs are not supported, since that seems to be the _de facto_ policy assertion here.

comment:3 Changed 12 years ago by Scott González

I have no idea what you're talking about. Nested tabs work fine.

comment:4 Changed 12 years ago by eh

Perhaps by default they work, but apparently not with certain customizations, whose characterization I can only find a mystery. The example stated uses identical styles, and isn't applicable as a counter-example to the original report I referenced, nor to my particular case.

Therefore, given that I'm currently in the middle of tracking down where my child tab-set events are going, because they seem to be disappearing entirely, I no longer consider nested tabs to be supported in any practical sense.

Nor am I motivated in any way to spend the time tracking down a minimal example, because I don't expect it to be taken seriously, as I see a repeated finger-in-the-ears kind of attitude.

comment:5 Changed 12 years ago by Corey Frang

We would love to fix a bug, or document a potential gotcha with nested tabs if you can help us to understand why your particular nested tabs are breaking.

Note: See TracTickets for help on using tickets.