Please can someone help me with order


This is more of a general query as the code works perfectly but I was wanting advice.

When applying class, id or style to a line of code is there a hierarchical order to follow. When I answered the question below I placed id=“orange-text” after class=“pink-text blue-text” and it worked. I was just wondering whether if there is a standard way, e.g. id, class, style…

I am very new to all this so I apologise if this is the wrong place to post this question but it is not clear in the tutorials.

Thank you in advance


Your code so far

body {
  background-color: black;
  font-family: monospace;
  color: green;
#orange-text {
  color: orange;
.pink-text {
  color: pink;
.blue-text {
  color: blue;
<h1 id="orange-text" class="pink-text blue-text">Hello World!</h1>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36.

Challenge: Override Class Declarations with Inline Styles

Link to the challenge:

in general, there is no difference

in practice, it depends on who you are working with, every project has its conventions and style rules, and in that contest you may need to follow certain orders

It is usually more in building the css file that there are certain sequences to follow, you can try to look up css best practices (there is more than one, and sometimes also in conflict with one an other)
at the end the important part is that a project is coherent with itself


Thank you for your help and advise.

You are a Legend