calculate DIV width and height

Discussion in 'HTML & Website Design' started by youlichika, Sep 27, 2010.

  1. #1
    
    <body style="width:100%;height:100%;margin:0;padding:0;">
    <div id="004" style="float:left;position:absolute;width:100%;height:100px;background:green;bottom:0px;margin:0;padding:0;">aaa
    </div>
    <div id="001" style="float:left;position:absolute;width:100%;height:100%;bottom:100px;margin:0;padding:0;">
    <div id="002" style="float:left;width:200px;background-color:blue;height:100%;margin:0;padding:0;">bbb</div>
    <div id="003" style="background-color:red;height:100%;margin-left:200px;margin:0;padding:0;">ccc</div>
    </div>
    </body>
    
    HTML:

    DIV001 AND DIV004 are parent div, DIV002 AND DIV003 are child div of DIV001.
    I want body: height 100%,width 100%;
    DIV004 fix on the bottom, height 200px,width 100%;
    DIV001 width 100%, heght 100%-200px,
    DIV002 width 200px,height 100% of DIV001,
    DIV003 width 100%-200px of DIV001,height 100% of DIV001.

    how to calculate the div width and height? Thanks.
     
    youlichika, Sep 27, 2010 IP