Stijn Bernards
Stijn Bernards

Reputation: 1091

What css attribute is more important?

What is more important: putting the style in the <div style="color: black !important"> or using a class and defining a value !important?

What is more important:

border-color: black !important;
border-right-color: transparent !important;

Will the right border be transparent now, or will it be black?

Upvotes: 0

Views: 107

Answers (6)

iVenGO
iVenGO

Reputation: 384

  1. Obviously, something is missing between "... style in the" and "or using ...". Use backticks for inline code snippets.
  2. Sinse both styles are used with !important, their strength is calculated according to their specificity, that are also equal. Thus, first applies, then the following is ovverriding first. Finally, we have top, left, bottom borders black, and right is transparent. See http://jsfiddle.net/hjrvue13/

UPD: I see you edited your question.

Inline style is more important than class, if class have directive !important, class is more important. If both inline and class have !important, again inline style is more important.

Upvotes: 0

Bunyomayn
Bunyomayn

Reputation: 34

!important, is used to determine priority.

.div {border:1px solid #ccc}
.div2 {border:2px solid #fff !important} //priority

Upvotes: 1

MoLow
MoLow

Reputation: 3084

style has hieher Specificity then a class.

you could see all about Specificity here: https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

I think the answer to question 2, is what comes latest in the css.

Upvotes: -2

Pedro Vaz
Pedro Vaz

Reputation: 820

Q1: If you mark as important in a class and then try to put a style for the same property, WON'T be applied.

Q2: It depends on the order that you put this on your file. They have the same priority. The latest one, will be the one that will be applied

Upvotes: 1

Andrei P
Andrei P

Reputation: 309

all sides of border except the right one will be black. right one will be transparent, as per your statement.

Upvotes: 1

In this case, left,top and bottom borders will be black. But, the border right will be transparent. Depends of the order of the commands. Because, both they have the same level of priority.

Upvotes: 1

Related Questions