Forum Moderators: not2easy

Message Too Old, No Replies

image margin problem - ff, ie, safari too

css image in table not aligning - shows white space

         

sldesigns

12:07 am on Mar 4, 2005 (gmt 0)

10+ Year Member



Working with tables/css and have one issue -- an image that is supposed to go in the bottom-left corner of a cell appears pushed out toward the right. I've taken out all other code/info and still does it. Here is a simplified page:

<?xml version="1.0" encoding="iso-8859-1"?><!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">
<head>
<title>&#8212; </title>
<style type="text/css">
body {
margin: 0px;
}
p, td, ul, ol, li {
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.bgvertline {
background-image: url(../images/e3d8bf.gif);
background-repeat: repeat-y;
margin: 0px;
padding: 0px;
}
#btm {
background-image: url(../images/btm/gear2.jpg);
background-repeat: no-repeat;
background-position: left bottom;
margin: 0px;
padding: 0px;
}
#left {
background-image: url(../images/left/stock/leftkey2.jpg);
background-repeat: no-repeat;
background-position: left bottom;
}
</style>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="6"> <table width="780px" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="132px" valign="top" id="left"> <p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p></td>
<td width="1px" class="bgvertline">&nbsp;</td>
<td id="btm" width="485px" valign="top"> <p>&nbsp; </p></td>
<td width="1px" class="bgvertline">&nbsp;</td>
<td width="161px" align="left" valign="top" id="news">&nbsp;</td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>

It's driving me nuts! Can you tell me what I've done wrong? THANKS!

SuzyUK

9:28 am on Mar 7, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi

not seeing a problem here with this code, perhaps I'm not understanding the question

..if you put a border on all your tables then put a background color on all the cells to visualise the columns then the images are appearing where they should with this code..

when you say way out to the right do you mean you would like the image to appear flush with left side of the outer table?

Suzy

sldesigns

3:22 pm on Mar 7, 2005 (gmt 0)

10+ Year Member



I've dropped this table layout, and went to css for positioning. It's done the trick. The image was supposed to butt up against the line between the left and middle columns, but was spaced out into the middle column.
Thanks for your reply, and the tip about background color/table borders. As I keep developing sites, hopefully that sort of thing will become more second-nature (or will at least occur to me before too many hours are wasted!)