[css-d] IE issues

[Dave Goodchild]

Hi all, I am pretty new to css from a layout perspective and made the
mistake of coding my page for Mozilla (ok, good to code for Mozilla and then
placate IE but I left viewing in IE until last).

My test page is available at http://www.web-buddha.co.uk/test1.php

...looks cool in Firefox and Opera, then I viewed in IE6...aaargh!

...any quick ideas, I am troubleshooting myself but your wider experience is
valuable. I know I have not added the Tantek box model hack for IE5, will do
that in time, but in IE6 it still looks like vomit!
Here is the css:

body {
margin: 0px;
padding: 0px;;
background-color: #fff;
color: #000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
line-height: 1.3em;
}

p {
font-family: Arial, Helvetica, sans-serif;
margin: 3px 1px 0px 1px;
}

p:first-line {
font-weight: bold;
}

#container {
width: 740px;
text-align: center;
margin: 8px auto 0px auto;
background-color: #000099;
}

#header {
text-align: left;
width: 738px;
height: 70px;
background-color: #0033CC;
border: 1px solid #000;
border-bottom: 0;
background-image: url(../../images/banner.gif);
}

#nav {
text-align: left;
padding: 3px;
width: 732px;
height: 24px;
background-color: #fff;
border: 1px solid #000;
border-bottom: 0;
}

#nav a:link {
text-decoration: none;
color: #000;
}

#nav a:visited {
text-decoration: none;
color: #000;
}

#nav a:hover {
text-decoration: none;
color: #ccc;
}

#nav a:active {
text-decoration: none;
color: #000;
}

#content {
position: relative;
background-color: #0099CC;
}

#text {
text-align: left;
position: absolute;
left: 0px;
width: 492px;
height: 400px;
top: 0px;
border: 1px solid #000;
padding: 3px;
background-image: url(../../images/text.gif);
}

#photos {
text-align: center;
position: absolute;
right: 0px;
top: 0px;
width: 232px;
height: 400px;
border: 1px solid #000;
padding: 3px;
}

#footer {
position: absolute;
top: 402px;
left: 0px;
width: 738px;
height: 70px;
background-color: #0033CC;
border: 1px solid #000;
border-top: 0;
}

.photo {
margin: 5px auto 0px auto;
width: 100px;
height: 100px;
border: 1px dashed #000;
}
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/