HTML differences between browsers

Question

Do you know any differences in the handling of HTML tags / properties in different browsers? For example, I once saw a page with an input tag with the maxlength field set to "2o". Firefox and Opera ignore the "o" and set the maximum length to 2, while Internet Explorer completely ignores the field. Do you know more?

(Note: seeing that this is likely to be a list, it would be great if the common difference name was highlighted in bold, for example: Handling various errors in tag properties )

Answer 1

Error Lists

Web developers have already put together some pretty complete lists; I think it's better to list resources than duplicate these lists.

• http://www.positioniseverything.net/
• http://www.richinstyle.com/bugs/table.html
• http://www.quirksmode.org/ (as mentioned by Christopher Johnson )

Javascript

I agree with Craig - best to program Javascript is, using a library that handles differences between browsers (as well as simplify things like of namespacing, processing AJAX events, and context). Here the transition to Craig is responsible (on this page).

CSS Reset

Resetting CSS can really simplify web development. They override settings that are slightly different between browsers to give you a more general starting point. I like Yahoo YUI Reset CSS .

Answer 2

Check out http://www.quirksmode.org/

Answer 3

If you are programming in javascript, the best advice I can give is to use the javascript library instead of trying to roll on my own. Libraries are well tested, and corner cases are more common.

Scriptalicious - http://script.aculo.us/
jQuery - http://jquery.com/
Microsoft AJAX - http://www.asp.net/ajax/
Dojo - http://dojotoolkit.org/
Prototype - http://www.prototypejs.org/
YUI - http://developer.yahoo.com/yui/

Answer 4

Do you know any differences in the handling of HTML tags / properties in different browsers

This question is asking for information about all the differences, including DOM and CSS? A bit of a big topic. I thought the OP asks about the behavior of HTML specifically, and not about all other things ...

Answer 5

The one that really annoys me is IE broken document.getElementById javascript function - in most browsers it will give you what the identifier you specified is, IE is glad to give you what matters in the name attribute, even if the document has something something else with the id you requested.

Answer 6

Once I saw a page with an input tag with the maxlength field set to "2o".

In this particular case, you are talking about incorrect code. The maxlength attribute cannot contain letters, only numbers.

What browsers do with the wrong code is very different, as you can see for yourself.

If you really ask, “What do all the different browsers do when they come across HTML code that is broken for any of an infinite number of reasons?”, This is crazy.

We can significantly reduce the problem space using valid code.

So use valid HTML. Then you are left with two main problem areas:

• browser errors - how the browser follows the HTML standard and what it does wrong
• default differences in the browser, such as the number of padding / margins it gives the body.

Answer 7

XHTML HTML inconsistent parsing

HTML parsers are not designed to handle XML.

If an XHTML document is used as "text / html" and compatibility recommendations , you cannot get unexpected results.

Empty tags are one of the possible sources of problems. <label> and <tag> </tag> are equivalent in XML. However, the HTML parser can interpret them in two ways.

For example, Opera and IE process <br> </br> as two <br> but Firefox and WebKit process <br> </br> as one <br>.