0

I have two styles affecting the same element (myDiv) from different stylesheets.

Stylesheet1.css

.myDiv{
  background-color:#000;
}

Stylesheet2.css

.myDiv{
  background-color:#FFF;
}

Neither style is more specific than the other, and neither have !important appended.

However I'm finding that the same css consistently gives priority to Stylesheet1.css on one server, but Stylesheet2.css on another! Can anyone suggest why that would be?

(Due to business reasons I don't want to simply fix it- I just want to understand why it is behaving that way.)

Urbycoz
  • 7,247
  • 20
  • 70
  • 108
  • 2
    depends on the order they are included – Pete Aug 18 '21 at 12:13
  • @Pete You mean like the position the reference appears in the html? – Urbycoz Aug 18 '21 at 12:19
  • 1
    The order of the rule - the one that comes last will take precendence – Pete Aug 18 '21 at 12:21
  • 1
    CSS goes from top to bottom. If you had the two styles in the same stylesheet, the second style would overwrite the other . If you have 2 stylesheets with the same selector, the style from the one you import second, that's the one that will overwrite the first. – Mihai T Aug 18 '21 at 12:21
  • Thanks guys. I know it seems simple now but I could not figure that out. – Urbycoz Aug 18 '21 at 12:25

0 Answers0