Rekha Rekha - 3 months ago 17
CSS Question

while setting the span element height as 100% it is not set as parent Div height

I am having two div elements. Between them I have a

span
element. The parent
div
element height is not given. But the height of
parentDiv
is calculated based on content of the
div
. But the
span
element height also set as 100%. But height of
span
element set as zero. Please refer the below code.

<div id="parentDiv">
<div id="child1"></div>
<span id="spanelement"></span>
<div id="child2"></div>
</div>

<style>
#spanelement{
height:100%;
width:100%;
}
</style>


Can anyone suggest me how to overcome this issue? Thank you.

Answer

This is because the parent is not 100%.

Try this-

body
{
 height:100%;
 width:100%;
}
html
{
 height:100%;
 width:100%;
}
.parentdiv
{
height:auto;
}