white lines between link graphics

Have ya tried validating that? I see some odd errors.

I know I've got some other errors that I don't want to deal with just yet but that's a good idea. I'll try to validate just the template without the main content and see if that helps me out. I'll let you know if it solved anything when I get a chance to try that.

Have you set the vspace on the images to "0" ?

If you have BR's seperating the images, they'll definatly need the vspace set to 0!

It's stuff like above that may be confusing the browser -- you have the table cell self-closing, then a closing tag for it. That's why I suggested valdidating it.

As far as I know, the vertical and horizontal space (vspace and hspace) are, by default, 0.

i used to think that but sometimes IE will stick a space between items if you have each item on a seperate line ie:

But if you put the whole thing on one line you won't get them.

<img src="image1.jpg"><br><img src="image2.jpg"><br><img src="image3.jpg"><br><img src="image4.jpg"><br>'

strange i know but i've had this happen before (its was in an older version of IE tho... things may be different now).

Yes that is the case in IE5. That code really needs validating though.
-dk

Or it might have something to do with margins :S

try this:

.img-with-no-space-class {
margin:0;
}

Good luck

Quote: Originally posted by andy206uk
i used to think that but sometimes IE will stick a space between items if you have each item on a seperate line [...] strange i know but i've had this happen before (its was in an older version of IE tho... things may be different now).

Well the thing is, that's not vspace or hspace in the image (nor margins or padding). That's the browser wrongly interpreting a line break in the code. Images, by default, have no margins, no padding, no hspace, no vspace.

HOWEVER, they do have some reserved space regarding where they are placed inline with text -- this is for the TEXT. Specifically, for the descenders.

More on that, with an explanation of why and how to get rid of the problem in newer browsers, here: http://devedge.netscape.com/viewsource/2002/img-table/

Well here's the problem with many of these theories: If everyone is seeing what I see, there isn't really an actual, physical space in there. When you hover over it (and remember this is not a mouse over effect) the white line disappears -- but watch closely as none of the graphics in the menu table shift up or down. If it were a real physical space that disappeared, all the graphics would have shifted as they "came together". This is like some sort of wierd illusion.

By the way, there's a lot of content that won't validate (yet) but I did validate that menu table and it validated fine.

Here's the code in question:

Hey, here's another question. I never wrote in there. I just got this from the net. Did IE add it? What is ? And that's not what I named my files? How did those really long jpg names get in there with spaces between words?

1. You have line breaks in your table cells -- see notes above how that will be mistaken for space and cause problems. Remove the line breaks. See also #4.

2. The space around images is not a theory. It's just possibly not applicable here.

3. IE is liberal in its interpretation of page source. *sigh*

4. Is this what you wrote? If so, what version of IE are you using?

Still a space in there, though. Also the last row is totally screwed up.

Wrong:

valign="top">
alt="" />

Right:

valign="top" background="/images/pstv-template_10.jpg" width="175" height="227"> 

See the difference? That last row couldn't have validated.

I'm not able to replicate what you're seeing, or I'd be able to troubleshoot it. What version of IE, what OS, et cetera?

1) IE 5.50.
2) Yes, what you posted above is exactly what I wrote. I haven't seen that 'text altering' before. It even changed my lowercase to uppercase. What's up with that?
3)Yes, now I see that error in the last row. I'm not sure if that is the cause of the lines but you're right that I need to fix it anyway.

I'll try to fix things up again when I get back home.

More:

Suzanne, that was a great article. I wasn't going to complicate my issue but if you look my page you'll also see a photo in the main section of a group of people with a black border around it. In IE5.5 I see a white border below that image too, and the line disappears if you scroll it up off screen and down again. It seems to be the same situation as the menu table but... not in a table. Even though this image is not in a table I tried adding style="display: block" to the image tag and it didn't help. I tried hspace=0 and it didn't help either. It now sounds like it isn't table related at all but an image situation, which puts me back to square one.

IE5 and IE5.5 have display errors unrelated to html caused by flash and animated gifs, btw. Perhaps unrelated. But also with white lines and sometimes the animated gif wanders up and sits on the task bar and fractures.

IE5 and IE5.5 also "rewrite" source code. Absolutely inexcusable as far as I'm concerned, but they didn't ask me!

So, now we know for sure we're dealing with something specific -- it's not the code, exactly, it's the browser glitch.

Let's look for that specific browser and glitch:

http://www.ntcweb.com/forums/hair/messages/5192.html

Tada, it's a display issue with the browser, nothing you can correct for. Except by upgrading your browser, of course. heh.

Less flippantly: I think it's really a display error problem with IE and the amount of graphics/size of graphical images on the page. If you're not seeing it anywhere else, that's weird, how about testing some huge graphic oriented sites and seeing if you can replicate the problem?