How do you get the rendered height of an element?
Let's say you have a <div>
element with some content inside. This content inside is going to stretch the height of the <div>
. How do you get the "rendered" height when you haven't explicitly set the height. Obviously, I tried:
var h = document.getElementById('someDiv').style.height;
Is there a trick for doing this? I am using jQuery if that helps.
Try one of:
var h = document.getElementById('someDiv').clientHeight;
var h = document.getElementById('someDiv').offsetHeight;
var h = document.getElementById('someDiv').scrollHeight;
clientHeight
includes the height and vertical padding.
offsetHeight
includes the height, vertical padding, and vertical borders.
scrollHeight
includes the height of the contained document (would be greater than just height in case of scrolling), vertical padding, and vertical borders.