What is the maximum maximum length for an HTML id?

Question

HTML specification says

Identifiers ID and NAME must begin with a letter ([A-Za-z]), followed by any number of letters, numbers ([0-9]), hyphen ("-"), underscore ("_"), colon (":") and periods (".").

And even if the SGML HTML 4 declaration uses the value 65536 for NAMELEN, it says "Avoid fixed limits."

But, of course, browsers, CSS implementations, and JavaScript tools should have some limitations on the length they support. What is the smallest such limit that can be safely used in an HTML / CSS / JS application?

Answer 1

Just tested: 1M characters work in every modern browser: Chrome1, FF3, IE7, Konqueror3, Opera9, Safari3.

I suspect that even longer identifiers may be difficult to remember.

Answer 2

The practical limit for me, however, is a long identifier that I can keep in my head while working with HTML / CSS.

This limit is usually between 8 and 13 characters, depending on how long I work and if the names make sense in the context of the element.

Answer 3

Sometimes I get very long identifiers, but I will call them sequentially to fit their specific purpose.

For example...

<div id="page"> <div id="primary-content"></div> <div id="secondary-content"></div> <div id="search-form-and-primary-nav-wrapper"> <form id="search-form"></form> <ul id="primary-nav"> <li id="primary-nav-about-us"></li> </ul> </div> <a id="logo"><img /></a> </div><!-- /#page --> 

As you can see, selectors are sometimes quite long. But this is much easier IMHO than working with something like YUI grids.css, where you get identifiers like #doc, #bd, # yui-main, etc.

Answer 4

If this is an academic question, it’s quite interesting ... but as for the best practices, you don’t need - or want to - stretch them. If you need to store data about an HTML element, it is better to put it in the attribute of the DOM object.