durisvk durisvk - 1 month ago 9
jQuery Question

JQuery height function outputs 1

I have the following CSS:

div#autosurf {
display: none;
width: 100%;
height: 700px;
position: relative;
}

div#autosurf #frames-container {
background: #ff88ff;
height: 79%
}

div#autosurf #info {
height: 19%;
}


I am trying to split the screen by 80% - 20%. This is ok and working. But the problem is when I do
$('#frames-container').height()
it outputs
1
. not
0
not
undefined
but
1
. Where could be the problem?

EDIT 1:
I've tried to set background color to that
frames-container
and I can see that height is bigger than
1
. what is wrong?

Answer

Remove display:none from div#autosurf

JSFiddle