HatchStyle Chart
Friday, July 13, 2012
Tuesday, July 10, 2012
Page Layout Using DIV
100% height and scroll able div
<html>
<body style="overflow:hidden;">
<div style="overflow:auto; position:absolute; top: 0px; left:0px; right:0px; bottom:0px">
</div>
</body>
</html>Fix height header and footer and scroll able main content
<html>
<body style="overflow:hidden;">
<div id="header" style="overflow:hidden; position:absolute; top:0; left:0; height:50px;"><div>
<div id="leftNav" style="overflow:auto; position:absolute; top:50px; left:0px; right:200px; bottom:50px;"></div>
<div id="mainContent" style="overflow:auto; position:absolute; top:50px; left: 200px; right:0px; bottom:50px;"></div>
<div id="footer" style="overflow:hidden; position:absolute; bottom:0; left:0; height:50px"></div>
</body>
</html>Note: for IE the main content div require doctype definition, without this the div height will not expand to the bottom position.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Subscribe to:
Posts (Atom)