CSS input[type="type"] need quotes? [duplicate]

StackOverflow https://stackoverflow.com/questions/21564541

  •  07-10-2022
  •  | 
  •  

Question

I have always thought that the CSS input[type] selector needs quotes to specify the type, e.g.:

input[type="email"], input[type="text"]

Now I downloaded a couple of styled checkboxes and the CSS reports:

input[type=checkbox] {
     display:none;
}

Are the quotes needed or it's just the same thing with or without them?

Was it helpful?

Solution

No, quotes are not needed as per the CSS grammar rules.

The rules are a bit confusing, but here is the relevant production. Note how the value can be an identifier (unquoted for word-like values) or a quoted string.

attrib
  : '[' S* IDENT S* [ [ '=' | INCLUDES | DASHMATCH ] S*
    [ IDENT | STRING ] S* ]? ']'

And the relevant tokens:

ident       -?{nmstart}{nmchar}*
nmstart     [_a-z]|{nonascii}|{escape}
nmchar      [_a-z0-9-]|{nonascii}|{escape}

string      {string1}|{string2}
string1     \"([^\n\r\f\\"]|\\{nl}|{escape})*\"
string2     \'([^\n\r\f\\']|\\{nl}|{escape})*\'

The astute reader might have noticed that "nonascii" is allowed in an identifier character: outside of the ASCII plane, all Unicode characters are technically allowed in an identifier. From a practical perspective, however, I recommend quotes in anything but "trivial" cases.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top