Topic: Why cant IE and FF get along? (Page 1 of 1) |
|
---|---|
Bipolar (III) Inmate From: Houston, TX |
posted 08-25-2006 19:57
http://www.sweenyhospital.org/newsite/ |
Bipolar (III) Inmate From: Sweden |
posted 08-27-2006 01:19
I can't seem to force the height of the main div to 100%. I assume that's why the script is there to move the footer onload/onresize. But IE doesn't seem to recalculate the box heights, based on the % values, after the footer is moved. That's probably because it's being absolutely positioned, and thereby excluded from the normal flow of the page. |
Paranoid (IV) Inmate From: Florida |
posted 08-27-2006 03:04
code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Sweeny Community Hospital</title> <style type="text/css"> html { height: 100%; } body { height: 100%; margin: 0; padding: 0 9%; } #wrapper { height: auto !important; height: 100%; min-height: 100%; position: relative; border: 1px solid black; border-top: 0; border-bottom: 0; } #footer { position: absolute; bottom: 0; left: 0; width: 100%; margin: 0; height: 53px; background: #003795; text-align: center; color: white; font: 0.75em 'trebuchet ms', arial, helvetica, sans-serif; padding-top: 12px; } h1 { margin: 0; width: 100%; height: 61px; background: #003795 url(images/header_logo.jpg) no-repeat left top; overflow: hidden; text-indent: -777em; } h1 br { display: none; } #nav { list-style: none; margin: 0; padding: 0; background: url(images/navi_bg.jpg) repeat-x top; border: 1px solid black; border-left: 0; border-right: 0; overflow: auto; display: inline-block; } #wrapper > #nav { display: block; } #nav li { float: left; } #nav a { display: block; color: #003795; font: bold 1em/1.9em 'trebuchet ms', arial, helvetica, sans-serif; padding: 0 1ex; text-decoration: none; } #nav li > a { line-height: 2.15em; } #nav a:hover { text-decoration: underline; } address { color: white; font: bold 0.75em 'trebuchet ms', arial, helvetica, sans-serif; position: absolute; top: 0; right: 1%; } #main { padding: 1em 1em 65px; } p { margin-top: 0; } </style> </head> <body> <div id="wrapper"> <h1> <a href="http://sweenyhospital.org/">Sweeny Community Hospital<br>You'll Know We Care</a> </h1> <address>305 N. McKinney, Sweeny, TX 77480 • 979.548.1500</address> <ul id="nav"> <li> <a href="">lorem!</a> </li> </ul> <div id="main"> </div> <p id="footer">© 2006 Sweeny Community Hospital</p> </div> </body> </html> |
Bipolar (III) Inmate From: Sweden |
posted 08-27-2006 22:25
Behold the beauty of CSS! |