Click to See Complete Forum and Search --> : Need help keeping cells centered in the page


outdoorxtreme1
04-04-2007, 07:54 AM
I am trying to make a table that is 800px and have background pics in fixed width table data cells on the left and right of the 800px table. I am having a problem keeping them together when screen resolution changes. I always want the 3 to stay together and have only the table data cells that have the   to change width when the resolution changes. What am I doing wrong?


<body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0">
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td>&nbsp;</td>
<td width="15" style="background:fixed url(/images/PWPLeftFade.gif);"></td>
<td>
<!-- header //-->
<table border="0" width="800px" cellspacing="0" cellpadding="0">
<tr>
<td>

</td>
</tr>
</table>
</td>
<td width="15" style="background:fixed url(/images/PWPRightFade.gif);"></td>
<td>&nbsp;</td>
</tr>
</table>
</body>

KDLA
04-04-2007, 11:33 AM
It's much easier to do this with css:
(BTW - the CSS in your post is semantically incorrect)

<style type="text/css">
body {text-align: center; background: url(/images/pwpfade.gif) no-repeat fixed top center;}
#wrapper {margin: 0 auto; width: 800px; text-align: left;}
</style>

html

<body>
<div id="wrapper">
a;lskdjf;lasdkfj
</div>
</body>


You'll need to combine your images into one in your image editor --
pwpleftfade.gif (800px blank space) pwprightfade.gif = 830px wide.
The wrapper, being 800px wide, will keep the text from overlapping the images. You may want to add padding to this to keep the text from touching the edges.

Good Luck -
KDLA