Дочерние элементы метки моего элемента списка исчезают в IE при открытии аккордеонного меню

Question

У меня есть приложение, которое работает довольно безупречно в Chrome и FF, однако, когда я смотрю его в IE, все хорошо, пока я не нажму на элемент заголовка, чтобы активировать его (jQuery accordion).

То, что происходит тогда, это то, что я вижу короткую вспышку там, где есть контент, а затем внезапно исчезает весь левый столбец. Этот столбец генерируется плавающим элементом метки с классом «.left», как показано ниже ...

<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>

Как видно из комментариев в приведенном выше коде (для двух элементов метки), метка описания исчезает, как только я установил для нее максимальную ширину (у меня нет максимальной ширины в левом элементе метки, но тем не менее исчезает).

Первоначальный вид этого меню UL в порядке (обратите внимание на объявление класса расширения, которое делает эту часть аккордеона открытой при запуске. Это не до тех пор, пока я не нажму «Общие настройки», чтобы закрыть его, а затем снова открою, что элементы левого класса исчезают (и только в IE)

Answer 1

Нет ответов на этот вопрос, но я наконец понял это. Поэтому, если у кого-то еще есть проблема с IE7 и меню аккордеона, вот решение.

У меня был контейнер div, положение которого было установлено относительно. Мне пришлось изменить свойство position на «static», а затем абсолютно позиционировать дочерние элементы относительно тела (а не относительно контейнера div).

Я смог сохранить свой CSS, не относящийся к IE, позиционированным относительно родительского div, предварительно добавив свой специфический для IE css *

Пример:

.wrapperDiv {
//all browswers except IE
position:relative; 
//IE gets this
*position:static;
}

.childDivExample {
//non IE positioning is relative to wrapperDiv
margin-left:20px;
//IE position is relative to the body document
//any property prepended with a "*" is only recognized by IE
enter code here
*position:absolute;
*left:200px;
*top: 100px;
}