Have a look at this page: http://labs.pieterdedecker.be/hetoog/layout.htm
It looks alright in Firefox, but IE messes it up. How come?
+3
A:
Your layout is a bit interesting. Instead of using empty table cells on either side of the page, you could take those out and achieve the centering using
body {
width: 750px;
margin: 0 auto;
}
And you HTML could be something like this:
<body>
<table>
<tr>
<td class="splash_desc">...</td>
<td class="splash_photo">...</td>
</tr>
...
With this method IE will not take up any more space than other browsers and will fit nicely inside the 750px wide container.
EDIT:
To get the header bar stretch horizontally 100%, you must make another div for the content. So, instead of using the body element to set the width, use something like this:
<body>
<table id="header"><tr>...</tr></table>
<div id="wrapper">
<table>
<tr>
<td class="splash_desc">...</td>
<td class="splash_photo">...</td>
</tr>
...
And in CSS:
#wrapper {
width: 750px;
margin: 0 auto;
}
This way you can have the table above wrapper to be 100% wide (just style it so), and the wrapper itself is 750px wide.
Tatu Ulmanen
2009-12-05 11:45:06
That works, but it ruins the soon-to-be navigation bar (on top of the page). How can I make sure it's stretched out 100% horizontally?
Pieter
2009-12-05 11:55:30
A:
The problem is
In IE6.0 <td> </td> wont support.
Specify width for the <td width="20%"> </td>
and PNG Images not support in IE6.
Download from http://www.twinhelix.com/css/iepngfix/
file : iepngfix.zip (40kb) will solve the problem
RSK
2009-12-05 11:49:02