jQuery: get height of child element when parent height is 0px

height, jquery, parent-child

Solution

Try all these and just working fine:

console.log($('#child').outerHeight());

console.log($('#child').css('height'));

console.log($('#child').height());

According to you edit:

var height = $('#parent').css({visibility: 'hidden', display : 'block'}).find('#child').height();

$('#parent').css({visibility: 'hidden', display: 'none'});

console.log(height);

DEMO

Problem

I have a div containing text which is inside another div displayed only under certain circumstances. The HTML for this is simple and looks like: ``` <div id='parent'> <div id='child'> Some text inside child div </div> </div> ``` The styling would look like: ``` #parent{ display:none; height:0px; } ``` Using jQuery I would like to obtain the height of the child as I would if the div was outside the parent. The following javascript returns 0, I wish for something around maybe 15. ``` var child_height = $('#child').height(); alert(child_height); ```

Original source