CSS selector priority

Question

Why does the css selector

select, textarea, input[type="text"], input[type="password"],input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input

take precedence over

input.text-style

for the following html:

<input type="text" required="required" name="poemDataCollector[name]" id="poemDataCollector_name" class="text-style">

I read that class should have priority over html tags...

It's called specificity value, I've posted a good answer on it once, let me find it — Madara's Ghost
– Madara's Ghost, Commented Jul 11, 2012 at 6:53
Your first selector should only take precedence if it is declared after your second selector. — BoltClock
– BoltClock, Commented Jul 11, 2012 at 6:56

Community · Accepted Answer · 2017-05-23 12:04:43Z

4

Attribute selectors are equally specific to class selectors.

if you want to override the class your can write like this:

input.text-style[type="text"]

Check this decision for more What is the specificity of the attribute selector?

Read this http://www.w3.org/TR/selectors/#specificity

edited May 23, 2017 at 12:04

CommunityBot

11 silver badge

answered Jul 11, 2012 at 6:53

sandeep

93.2k24 gold badges140 silver badges156 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

CSS selector priority

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related