My UL child label elements disappear in IE on accordion menu opening
- by Scott B
I've got an app that's working pretty flawlessly in Chrome and FF, however, when I view it in IE, all is well until I click on a header element to activate it (jQuery accordion).
What happens then is that I see a brief flash where the content is there, then suddenly the entire left column disappears. This column is generated by a floated label element with a class of ".left" as seen below...
<ul class="menu collapsible">
<li class='expand sectionTitle'><a href='#'>General Settings</a>
<ul class='acitem'>
<li class="section">
<label class="left">This item if floated left with a defined width of 190px via css. This is the item that's disappearing after a brief display</label>
<input class="input" value="input element here" />
<label class="description">This element has a margin-left:212px; set via css in order to be positioned to the right of the label element as if in an adjacent table cell. When I add a max-width property to this element, it disappears in IE too!</label>
</li>
</ul>
</li>
</ul>
As you can see from the comments in the code above (for the two label elements) the description label disappears once I set a max-width on it. It shows up fine otherwise.