Невозможно установить DIV, равный другому DIV HTML/Javascript

Question

по какой-то причине, моя оболочка div не будет равна той же высоте, что и my maincontent div. Я отправлю код, и мне бы хотелось, чтобы кто-то помог мне понять, почему. Кроме того, я могу использовать JQuery в случае необходимости

Javascript:

var wrap=document.getElementById('wrapper'); 
var left=document.getElementById('maincontent').style.height; 

wrap.style.height=left; 

HTML:

<div id="wrapper"> 

    <!-- TemplateBeginEditable name="Main Content" --> 

    <div id="maincontent"> 

    </div> 

    <!-- TemplateEndEditable --><!-- TemplateBeginEditable name="Background image" --> 

    <div id="image" style="background-image: ;"> 

    </div> 

Answer 1

Я не знаю, правильно ли я догадался, но. , ,

Одна из возможных причин того, что вы описали, - наличие инструкции float в DDIV.

See this jsFiddle example

В примере, оболочка DIV неправильный рост - он игнорирует присутствие MainContent DIV и MainContent DIV, кажется, под ним.

Это вызвано инструкцией float:left в maincontent DIV. A float удалит этот DIV из потока HTML, а родительскому DIV будет отсутствовать эта высота. Фактически, основное содержимое DIV переполняет упаковку DIV.

РЕШЕНИЕ:

Поместите overflow:hidden или overflow:auto на родительском DIV (то есть, на обертке DIV).

See this jsFiddle demo of the solution

---

Примечание:

position:absolute и position:fixed также удалить DIVs из потока. Однако они не могут быть «исправлены», используя overflow:________. Возможно, потребуется вручную установить высоту содержащего DIV или использовать javascript или другое волшебство.

Answer 2

1- Если вы тусклый, чтобы получить тонированное высоту элемента используйте один из clientHeight или offsetHeight или scrollHeight вместо style.height

2- убедитесь, что обертка закрывающий тег </div>

3- при определении высоты элемента не забудьте «точек» после того, как значение высоты.

4- Если у вас есть изображения без высоты, установленной для них в вашем div, вам нужно дождаться загрузки изображений до запуска функции высоты. вы можете использовать $(window).load или некоторые другие методы ...

Answer 3

Вы должны знать разницу между ele.style.height и ele.clientHeight.

Я написал демку здесь,

http://jsbin.com/ninure/edit?html,css,js,console,output

Может это поможет.