Previous Message
Next Message

Firefox & IE: Different results

Sent by Jukka K. Korpela on 24 May 2007 11:11


On Wed, 23 May 2007, Rachel Vidrine wrote:

> I am creating a CSS menu for a client, and it looks fine in Firefox, but 
> in Explorer, there is a space between the first and second links and the 
> third and fourth links. It looks strange.

It surely does.

> Can someone explain to me why this is
> happening and what I can do to remedy it?

To start from a practical solution, remove all whitespace (including line 
breaks) between <li> elements, i.e. between </li> and <li> tags. This 
fixes the issue both on IE 6 and on IE 7.

For IE 7, it is sufficient to add the following at the very start of 
the page:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
         "http://www.w3.org/TR/html4/strict.dtd">

This puts IE 7 into "standards mode", where it correctly ignores 
whitespace between elements. Actually, it was new to me that on IE 7, 
there's this difference between the modes, so I added a note on it into my 
page on the effects of Quirks Mode:
http://www.cs.tut.fi/~jkorpela/quirks-mode.html#ws
(If anyone has suggestions on improving the wording of the description, 
please reply privately.)

> Here is the menu:

As a rule, it's better to post a URL than a copy of the code. It's easier 
to others to check the situation. Besides, the URL often leads to 
essential information not included in a code snippet, such as the presence 
or absense of a DOCTYPE declaration.

I was puzzled by the phenomenon that there was no gap between the second 
and third link. It seems that there is oddity in oddity:

        <li><a href="drug.html">Drug Possession

        &amp; Manufacturing </a></li>

The space before the </a> tag (for the second item) seems to make the 
"white space bug" go away. If I remove the space, there's a gap 
between the second and third link, too. Rather maddening, is it not? A 
space that should be insignificant implies that IE does not treat other 
whitespace incorrectly as significant.

-- 
Jukka "Yucca" Korpela, http://www.cs.tut.fi/~jkorpela/

______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Message thread: