Problems with Valid HTML

Things I've come across where browsers get it wrong even with valid, strict html:

Frames

In IE 6, a totally spurious horizontal scroll bar appears. This very site goes on about it ad nauseam. I had to mention it here.

Image with 0 Size

When an image has the height and width set to 0, Netscape 4 displays it at full size. In order to hide images, eg for pre-loading, they therefore have to have a size of 1 pixel.

Table with Width 100%

In IE 5, when a table has a width of 100%, this is interpreted to be 100% of the viewport, not 100% of the container.

See La Chatte Noire for illustrations and workarounds.

Empty Anchor Name

Apparently some browsers can't cope with an empty anchor name, although this probably only applies to much older ones.

XML Definition

When an XHTML doc starts with the XML declaration, eg
<?xml version="1.0" encoding="UTF-8"?>,
it sends IE 6 into quirks mode.

#top

IE has in-built anchor names of "top" and "bottom" which are the top and bottom of the page. These are not part of standard html so for these links to work in other browsers such as Mozilla, the named anchor msut be set up. Anyway, IE jumps slightly short of the top when #top is used, so it's generally better to use the page name instead.

Home