Image padding / margin glitch in IE6/7/8

HTML & CSS
1

I might be missing some wood for some trees, but I can’t see what’s going on here. Basically its the table with the photo of the girl, and the About Me details to the right of that.

Its a bit crude as I was just working on the layout, so the borders are still visible.

If you look at it in Firefox or safari its as it should be, but in IE the text is being pushed too far over to the right. Its fine when I take out the image, so it presumably has something to do with the image.

I don’t think there’s any IMG padding / margin settings anywhere that would do that.

The CSS for the table currently looks like this :


.stafftable { 
	background-image:url(../images/stafftablebg.jpg);
	background-repeat:no-repeat;
}
.stafftable img{ 
	padding: 0 0 0 0;
	margin: 0 0 0 0;
}
.aboutcell { 
	padding:5px 8px 5px 8px;
	color:#FFF;
	font-size:14px;
	border-bottom:1px solid #385233;
}
.titlecell { 
	padding:2px 8px 2px 8px;
	color:#FFF;
}

And the page is here :

http://www.haiji.jp/new/staff.htm

if anyone can spot what’s causing that to happen, and suggest a fix, I’d be most grateful.

Thanks.

2

Its OK - I figured out what it was.

3

Mind sharing the answer for anyone who comes along searching for this thread? :slight_smile:

4

I managed to fix it by specifying the widths for the rows under the green ‘About Myself’ details.