[thelist] IE 5 Mac CSS problem

Sun Mar 28 00:54:39 CST 2004

Tried posting this the other day, but apparently my server had a problem
with TheList mail or something, so I got no response (or any TheList mail at
all).  Apologies for the repetition.  Though, my subject line said "IE 5
Win" but it's IE 5 Mac.

I'm a newbie making slow progress with CSS and XHTML.
I have a problem with a recent layout on IE 5 Mac (and Opera 6 Mac too).  I
have a child div aligning itself in the center, even though it has left:0.
There's a border problem below that, but that's not such a big deal.  This
misplaced div is irritating though!  The page is at:
http://www.politicalmusings.net  (see content disclaimer below!)
I've a screenshot of IE 5 Mac's rendering:
http://www.neptunewebworks.com/tmp/pm_net_ie5mac.jpg

Here is the relevant code, abridged for simplicity:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head  profile="http://gmpg.org/xfn/1">
	<title>:: Political Musings ::</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<head>
<body>
<div id="container">
		<div id="banner">
			<a href="http://www.politicalmusings.net/" title="political musings">
			<img src="http://www.politicalmusings.net/template_images/masthead.jpg"
height="149" width="771" alt="PoliticalMusings.net" /></a>
			<div id="slogan"><img
src="http://www.politicalmusings.net/template_images/slogan.jpg" height="47"
width="189" alt="Enemies in War, in Peace Friends" /></div>
			<div id="timestamp">Thursday, March 25th 2004</div>
		</div>
<!-- bunch of omitted code -->
</body>

body {
	background-color: #c0c0c0;
	padding: 0;	margin: 0 auto;
	text-align: center; color: black;
	font: normal 76%/100% Verdana, Geneva, Arial, Helvetica, sans-serif;
}
div#container {
	border: 0; margin: 0; margin-left: auto;
	margin-right: auto; padding: 0;
	background-color: white; width: 771px;
}
div#banner {
	position: relative;
	padding: 0;	margin-bottom: 0px;
	background-color: #323896;
	color: white; font-size: 0.9em;
}
div#timestamp {
	position: absolute;
	top: 5px; right: 5px;
	font-size: 0.8em;
}
div#slogan {
	position: absolute;
	top: 127px;
	left: 0px;
}

Any suggestions would be appreciated!

PS - The political opinions on that site are *NOT* mine, nor do they even
resemble mine.  I'm just concerned with doing the job right.

Maximillian Von Schwanekamp
NeptuneWebworks.com
voice: 541-302-1438
fax: 208-730-6504