Высота () не возвращает правильную высоту элемента

Question

Я пытаюсь исправить переполнение плавающего содержимого, регулируя высоту блока по высоте переполненного содержимого, но, похоже, это не помогает.

            if ( $('.content-right').outerHeight() > $('.content-right').parent().parent().height() ) {
                $('.content-right').parent().parent().height($('.content-right').outerHeight(true));
            }
            console.log('Box Height: ' + $('.content-right').parent().parent().height());
            console.log('Content Height: ' + $('.content-right').height() );

Это будет выводить

Box Height: 599
Content Height: 594 

Что неверно, так как div в приведенном ниже примере явно намного больше. Есть идеи?

Проблемная область в виде изображения: http://prntscr.com/4p1obb

Answer 1

В старых версиях есть ошибка jQuery outerHeight, из-за которой высота не будет возвращаться, если вы не передадите параметр. Также, как предлагается в комментариях, вам нужно удалить истинную высоту ().

if ( $('.content-right').outerHeight(true) > $('.content-right').parent().parent().height() ) {
  $('.content-right').parent().parent().height($('.content-right').outerHeight(true));
}
console.log('Box Height: ' + $('.content-right').parent().parent().height());
console.log('Content Height: ' + $('.content-right').height() );

ОБНОВИТЬ:

Попробуйте это (и упомянутая выше ошибка все еще применяется, поэтому убедитесь, что вы указали параметр). Код ниже дает мне высоту 868.

var outerHeight = 0;
$('.content-right > *').each(function() {
  outerHeight += $(this).outerHeight(true);
});
console.log(outerHeight);