Как изменить размер контейнера div до общей высоты его дочерних элементов?
Я считаю, что теперь вы можете использовать Window.getComputedStyle ()
var style = window.getComputedStyle(element[, pseudoElt]);
Пример для получения ширины элемента:
window.getComputedStyle(document.querySelector('#mainbar')).width
4 ответа
Это - очень нечетный вопрос, как высота отделения всегда является высотой своих детей.
Вы пускаете в ход содержание в своем контейнерном отделении? То, когда Вы плаваете, ребенок удовлетворяют содержание отделения, больше не действует то же.
При плавании содержания, которое расширяется мимо нижней части контейнерного отделения, добавьте следующее отделение к самой нижней части детей контейнерного отделения:
<div style="clear:both;"></div>
Это не позволит детям плавать по нему, таким образом вынуждая содержание отделения быть высотой своего самого высокого ребенка...
<div id="container">
<div id="dynamic" style="float:left;width:100px;">dynamic content goes here</div>
<div id="static" style="margin-left:104px;">Lots of static stuff here</div>
<div style="clear:both;"></div>
</div>
Хорошо, я не уверен, почему Вы делаете расположение путем, Вы, но я сделал что-то подобное для веб-сайта, который должен был быть похожим на настольное приложение. Я не полагаю, что существует любой способ сделать это кроме с JavaScript. Документы HTML разработаны, чтобы течь, не быть твердыми. Если Вы хотите взять на поруки на JavaScript, необходимо будет отпустить стилей позиционирования и использовать плавание и очистку отделений. Не настолько ужасный...
если Вы пускаете в ход контейнерное отделение "переполнение: автоматический" может также работать волшебно, особенно относительно целого разгрома IE hasLayout
Вы не указывали, но я думаю, что у Вас есть проблема с плавающими элементами, и Вы хотите контейнер, в котором они находятся быть, по крайней мере, размером самого большого плавающего элемента. Необходимо попробовать следующий взлом CSS, который вынуждает браузер повторно представить размер контейнерного элемента к размеру плавающих элементов:
#wrapper:after {
clear:both;
content:".";
display:block;
height:0;
visibility:hidden;
}
Сообщите мне то, что Вы придумываете и если это работает. Существует много других взломов для попытки, в зависимости от браузера.
Я попытался бы изменить CSS для не использования абсолютного расположения. В Firefox необходимо было бы использовать упоминание приема обертки в комментариях для получения mapcontainer правильная высота.
div#mapcontainer {clear:both; % width:100; минимальная высота: 600 пкс;}
div#main {float:left; оставленный полю: 10 пкс; ширина: 500 пкс; высота: 400 пкс;}
div#sidebar {float:left; поле-top:10px; поле-right:10px; ширина: 155 пкс; высота: 405 пкс;}