Chintan_chiku Chintan_chiku - 6 months ago 18
HTML Question

how to set child div width 80% to parent div

i want to set child div width to be 80% of parent div. how to do

<div id='container'>

<div id="toolbar" class="ui-widget-header ui-corner-all" style="padding:3px; vertical-align: middle; white-space:nowrap; overflow: hidden;">
<button id="BtnPreviousMonth">Previous Month</button>
<button id="BtnNextMonth">Next Month</button>
</div>

<div id='subcontainer'>

<div id="mycal" style="position:absolute;"></div>
</div>
</div>


when i set mycal width and height in %. it has no effect. any suggestions ?

Answer

Set width:80% , you can set width in percentage(%) , The percentage is calculated with respect to the width of the generated box's containing block.

HTML:

<div id="container">
<div id="child">
</div>
</div>

CSS:

#container{
   position:relative;
   width:500px;
   height:100px;
}
#child{
   width:80%;
}

Fiddle Demo