Question

height: 100% in CSS obviously doesn’t work. So is there any other CSS or JavaScript/jQuery solutions to this problem? Please advise.

Answer 1

‘Let’s say your problem element is a <div>. If you make sure your <div>s height has something to reference to, almost all your problems will disappear:

#my_div
{
  height: 100%; /* Won't work. What is 100% of an unknown/unset value? */
}

Make sure the <div>‘s parents have a set height too. I usually do this (well, not exactly, but you get the idea):

#my_div, #parent_of_the_div, body, html
{
  height: 100%; /* This works, but it will show scrollbars if the body
                   or html elements have padding or margins. */
}