Topic: Why cant IE and FF get along? $Pages that link to <a href="https://ozoneasylum.com/backlink?for=28368" title="Pages that link to Topic: Why cant IE and FF get along?" rel="nofollow" >Topic: Why cant IE and FF get along?\$

Author	Thread
Patrick Bipolar (III) Inmate From: Houston, TX Insane since: Dec 2001	posted 08-25-2006 19:57 http://www.sweenyhospital.org/newsite/ in FireFox it looks fine, but in IE I cant think of a way to make the border stick. Also more to the point, Im not looking for a site review becasue it isn't finished but A CSS Review or HTML Review would be helpful. Any constructive criticism is welcomed and appreciated. ---------- Why have a signature when your comments arent as big?
TwoD Bipolar (III) Inmate From: Sweden Insane since: Aug 2004	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. Or atleast that's what I can figure out on my way to bed, after a loooong day at work... /TwoD
reisio Paranoid (IV) Inmate From: Florida Insane since: Mar 2005	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>
TwoD Bipolar (III) Inmate From: Sweden Insane since: Aug 2004	posted 08-27-2006 22:25 Behold the beauty of CSS! But I don't like that "DOH!"-feeling you always get too late... /TwoD

Topic: Why cant IE and FF get along?\$

Author

Thread

Patrick
Bipolar (III) Inmate

From: Houston, TX
Insane since: Dec 2001

posted 08-25-2006 19:57

http://www.sweenyhospital.org/newsite/

in FireFox it looks fine, but in IE I cant think of a way to make the border stick. Also more to the point, Im not looking for a site review becasue it isn't finished but A CSS Review or HTML Review would be helpful. Any constructive criticism is welcomed and appreciated.

----------

Why have a signature when your comments arent as big?

TwoD
Bipolar (III) Inmate

From: Sweden
Insane since: Aug 2004

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.

Or atleast that's what I can figure out on my way to bed, after a loooong day at work...

/TwoD

reisio
Paranoid (IV) Inmate

From: Florida
Insane since: Mar 2005

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 &bull; 979.548.1500</address>
			<ul id="nav">
				<li>
					<a href="">lorem!</a>
				</li>
			</ul>
			<div id="main">
			</div>
			<p id="footer">&copy; 2006 Sweeny Community Hospital</p>
		</div>
	</body>
</html>

TwoD
Bipolar (III) Inmate

From: Sweden
Insane since: Aug 2004

posted 08-27-2006 22:25

Behold the beauty of CSS!
But I don't like that "DOH!"-feeling you always get too late...

/TwoD

Post Reply

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Loading...
Options:	Show Signature Enable Slimies Enable Linkwords

Topic: Why cant IE and FF get along?

Insert Slimies »

Insert UBB Code »

Topic: Why cant IE and FF get along? $Pages that link to <a href="https://ozoneasylum.com/backlink?for=28368" title="Pages that link to Topic: Why cant IE and FF get along?" rel="nofollow" >Topic: Why cant IE and FF get along?\$