PDA

View Full Version : 1 Pixel Away



cameron
08-19-2004, 01:57 AM
I just did a bit of work on a the design of my new site, and I'm having a problem.

http://www.mosquito-trap-reviews.org/

The black border line lines up fine with the image in IE, but is off by 1 pixel in Firefox. Any ideas what I have to do to fix this?

James
08-19-2004, 03:51 AM
They render the same in Firefox 0.9.3 and IE6, except for some grey blotch at the bottom of the layout in IE6.

r2d2
08-19-2004, 04:37 AM
Looks ok to me in Ff 0.9.1 on linux.

Its probably due to the box model problem though, its best not to set an absolute width and padding/border/margin for divs, use two divs, one for the width, then put the border one inside and set width to 100%.

Edit: ah, ignore all that, I see ur using tables, will have to see it in IE later.

cameron
08-19-2004, 01:18 PM
I've tried changing the size of the text in the green area, and that fixed the problem (i'm doing this in an offline version of the page). I don't understand though, why this would have any effect, because none of the text is wide enough to be forcing the cell to expand.

James
08-19-2004, 04:48 PM
Ah yes, it appears to do this whenever the text size is increased or decreased too much.

intelliot
08-19-2004, 05:06 PM
Cell padding perhaps? Are you using nested tables?

cameron
08-19-2004, 06:26 PM
No nested table, and cellpadding is set to 0. I do have padding-top: 10px for the green part. I'm just using " " on each line to make it look like there is padding on the sides.

James
08-19-2004, 06:53 PM
I'm just using " " on each line to make it look like there is padding on the sides.
Try adding overflow: hidden; to the table's CSS. That's a quick and dirty solution.