Specify multiple attribute selectors in CSS
For concatenating it's:
input[name="Sex"][value="M"] {}
And for taking union it's:
input[name="Sex"], input[value="M"] {}
Just to add that there should be no space between the selector and the opening bracket.
The following will trigger every td
with an attribute named attr
td[attr]
The following will trigger every elements inside a td
with an attribute named attr
(not the td itself)
td [attr]
Concatenate the attribute selectors:
input[name="Sex"][value="M"]
Simple input[name=Sex][value=M]
would do pretty nice. And it's actually well-described in the standard doc:
Multiple attribute selectors can be used to refer to several attributes of an element, or even several times to the same attribute.
Here, the selector matches all SPAN elements whose "hello" attribute has exactly the value "Cleveland" and whose "goodbye" attribute has exactly the value "Columbus":
span[hello="Cleveland"][goodbye="Columbus"] { color: blue; }
As a side note, using quotation marks around an attribute value is required only if this value is not a valid identifier.
JSFiddle Demo