Why does border-top CSS selector work only below the main border selector?

Question

The "border-top:" selector when used above the "border:" selector does not work. But when put below it, it works. Why does it happen? Does it happen with other selectors as well?

Answer 1

CSS is particular about the order that you do things. "Border" is handling ALL of the border angles, including border-top. So when you do "border-top" first, you set it and then you do "border" which overwrites the previous change because it's also setting the "border-top" property.

Hope that helps! Always think about your order and think about it as if you gave someone a list of tasks to complete and they must complete them in order. So if you tell them to paint the wall blue and the next task is to paint that same wall red, in the end the wall will be red instead of blue.

Answer 2

No