html - Margin bottom not working on %100 div -


i have following html code:

<html>  <body style="margin:0px; padding:0px;">    <div id="outer" style="height:100%;">      <div id="header" style="height:40px; background:blue;">header</div>      <div id="main" style="height:100%; margin-bottom:-40px; background:red; overflow:auto;">         <p style="height:1000px">main</p>      </div>    </div>  </body> </html> 

i want vertical scroll appear on main div when content within exceeds viewable area, seems margin-bottom on main div not working.

can me issue?

you seem solving wrong problem, actually. if want rid of scroll bar body itself, set body's style overflow:hidden.

<html>   <body style="margin:0px; padding:0px;overflow:hidden;">    <div id="outer" style="height:100%;">      <div id="header" style="height:40px; background:blue;">header</div>      <div id="main" style="height:100%; margin-bottom:-40px; background:red; overflow:auto;">         <p style="height:1000px">main</p>      </div>    </div>  </body> </html> 

this should resolve margin issue, , have keep sizes right.


Comments

Popular posts from this blog

php - What is the difference between $_SERVER['PATH_INFO'] and $_SERVER['ORIG_PATH_INFO']? -

fortran - Function return type mismatch -

queue - mq_receive: message too long -