JQuery Same Height DIVs

Question

Я новичок в этом, поэтому я думаю, что мне не хватает чего-то простого.

Вы можете увидеть его here.

Как видно из сообщений, JavaScript работает нормально, но два DIV не изменяются на одну и ту же высоту.

JavaScript Я использую это:

function doResize() { 
    alert('before: being ' + $('#being').height()); 
    alert('before: questions ' + $('#questions').height()); 
    maxHeight = 0; 
    var divs = jQuery("#questions, #being"); 
    $.each(divs, function() { 
     var height = jQuery(this).height(); 
     if (maxHeight < height) maxHeight = height; 
    }); 
    divs.height(maxHeight); 
    alert('after: being ' + $('#being').height()); 
    alert('after: questions ' + $('#questions').height()); 
    $("#main").css('visibility', 'visible'); 
} 

Я называю эту функцию на событие OnLoad документа.

Пожалуйста, руководствоваться мной, потому что этот код работает на других страницах!

С наилучшими явлением!

EDIT (здесь исправленный код):

function doResize() 
{ 

    //alert('before: being ' + $('#beingContent').height()); 

    //alert('before: questions ' + $('#questionsContent').height()); 

    maxHeight = 0; 

    var divs = jQuery("#questionsContent, #beingContent"); 

    $.each(divs, function(){ 
     var height = jQuery(this).height(); 
      if(maxHeight<height) 
       maxHeight = height; 
    }); 

    divs.height(maxHeight); 

    $('#beingContent').css('height', maxHeight - 2); 

    //alert('after: being ' + $('#beingContent').height()); 

    //alert('after: questions ' + $('#questionsContent').height()); 


    $("#root").css('visibility', 'visible'); 

} 

и CSS:

#beingContent { padding:0 5px !important; border:1px solid black !important ;} 

Это решило проблему выравнивания! Благодарю.

Answer 1

CSS

#being { 
    padding:0 5px !important; 
} 

---

ДИВ с being имеет padding :5px так сверху и снизу получает 5px дополнительные каждый, которые создают разные, так вместо padding :5px просто присвоить отступ слева и справа.

Answer 2

Удалить границы/отступы от css; или используйте this для победы. :)

Потому что я ленив тоже, просто добавьте в таблицу стилей:

/* apply a natural box layout model to all elements */ 
*, *:before, *:after { 
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; 
}