Have a look at this page: htt开发者_运维知识库p://labs.pieterdedecker.be/hetoog/layout.htm
It looks alright in Firefox, but IE messes it up. How come?
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.
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
精彩评论