Динамическая высота на основе другого элемента (JQuery)

Question

HTML:

<div class="main" style="float:left"> 
    lorem ipsum <br /> 
    lorem ipsum <br /> 
    lorem ipsum <br /> 
</div> 
<div style="float:right"> 
    <div class="block">block</div> 
    <div class="block">block</div> 
    <div class="block">block</div> 
</div> 

JQuery:

$('.block').height($(".main").height()/(3)); 

... каждая высота блока = высота основного/3

Это неточно, потому что высота не учитывает маржу/дополнение .block. Как вычесть заполнитель/маржу автоматически или вручную?

Answer 1

Вы должны использовать outerHeight

$('.block').height($(".main").outerHeight(true)/3); 

EDIT я неверно документы первоначально, и думал, что margin был включен по умолчанию. Я был неправ! Обязательно передайте true функции outerHeight, чтобы включить маржу. Спасибо @Alex Sexton!

Answer 2

Вы можете быть заинтересованы в методах outerHeight и outerWidth в JQuery

http://docs.jquery.com/CSS/outerHeight

http://docs.jquery.com/CSS/outerWidth

Надежда, что помогает!