Предисловие
Я снова натолкнулся на одну из этих странных вещей в Internet Explorer и столкнулся со стеной.Чтобы быть более точным, это IE8 .Я также проверил в IE7, и там нет никаких проблем, так что есть что-то с IE8 ..
Обратите внимание, что есть пример JSFiddle внизу этого постаэто воспроизводит мою проблему.
Быстрое объяснение
У меня есть ul, который используется для расширения / сжатия контента при нажатии span.content_head.По умолчанию сначала отображается содержимое.
<div id="spreadsheet_overview">
<ul class="overview_list">
<li>
<div class="content_head">
<div class="indicator"></div>
Recipe calculation
<div class="summation">
<span class="title">1 tablet cost:</span>
<span class="value">0.09360828</span>
</div>
</div>
<div class="container">Lots of content</div>
</li>
</ul>
</div>
$("div.content_head").click(function(e){
$(this).next(".container").toggle();
$("div.indicator",this).toggleClass("contracted");
});
Проблема
Проблема возникает, когда я нажимаю на контракт.Позвольте мне сначала показать вам, как это выглядит в Firefox, где он работает.
Документ состоит из
- тела - слегка темно-серого цвета
- оболочка, ярко-серая
- разделительная колонка, темно-серая
- больше разделителей, белая
Как видите, документ заканчивается после «расчета рецепта», ивысота документа отрегулирована и удалены вертикальные полосы прокрутки.
Оболочка также отрегулировала свою высоту.
Однако в Internet Explorer 8, когда я делаю то же самое, обертка сохраняет свою высоту какесли контент все еще показывался.Почему он не регулирует высоту в IE?
Я проверил, и высота остается точно такой же, как прежде, чем я спрятал содержимое.
Если это проблема CSS, и я уверен, что это может быть?
JSFiddle
Вот JSFiddle , который может воспроизвести мой конкретныйвопрос.Я попытался сократить CSS достаточно для элементов только в этом выпуске.
Вероятно, это то, что я сделал с CSS / HTML.
Надеюсь, один из вас сможет это заметить, потому что я уверен, чточерт не может ...
Нажав на «Расчет рецепта», вы скроете содержимое, и вы заметите, что высота все та же.В IE8.
Оцените помощь!
Edits
w3d указал, что при переключении атрибута height: auto в инструментах разработчика, будет корректироваться высота оболочки.После дальнейшего изучения, я делаю то же самое, когда я изменяю размер окна.