CSS attribute selectors: The rules on quotes (", ' or none?)

css, css-selectors, string

Solution

I’ve written more extensively on the subject here: Unquoted attribute values in HTML and CSS.

I’ve also created a tool to help you answer your question: http://mothereff.in/unquoted-attributes

You can usually omit the quotes as long as the attribute value is alphanumeric (however, there are some exceptions — see the linked article for all the details). Anyhow, I find it to be good practice to add the quotes anyway in case you need them, i.e. `a[href^=http://]` won’t work, but `a[href^="http://"]` will.

The article I mentioned links to the appropriate chapters in the CSS spec.

Problem

This question has been bugging me for a while now. When writing a CSS selector that compares against an element's attribute like so. ``` a[rel="nofollow"] ``` I never know what I should be doing with the quotation marks. Are they really necessary? Basically, what is the specification for this because I can't find it on the web site. Are all of these considered valid? ``` a[rel="nofollow"] a[rel='nofollow'] a[rel=nofollow] ```

Original source