CSS priority

Here is an example for the css priority levels: The code will be this:

<div class="main">
 <div class="container">
  <div class="mydiv" id="textid">
   Text
  </div>
 </div>
</div>

Here is a list of stronger priorities starting from the lowest:

1
div{
     color:blue;
}	
2
.mydiv{
     color:blue;
}	
3
div .mydiv{
     color:blue;
}	
4
.container .mydiv{
     color:blue;
}	
5
container .mydiv{
     color:blue;
}	
6
.main .container .mydiv{
     color:blue;
}	
7
#textid{
     color:blue;
}	
8
div #textid{
     color:blue;
}	
9
.container #textid{
     color:blue;
}	
10
container #textid{
     color:blue;
}	
11
.main .container #textid{
     color:blue;
}	
12
inline css:
<div class="main">
 <div class="container">
  <div class="mydiv" id="textid" style="color:blue;">
   Text
  </div>
 </div>
</div>	
13
.mydiv{
     color:blue!important;
}	
14
.container .mydiv{
     color:blue!important;
}	
15
.main .container .mydiv{
     color:blue!important;
}	
16
#textid{
     color:blue!important;
}	
17
div #textid{
     color:blue!important;
}	
18
.container #textid{
     color:blue!important;
}	
19
container #textid{
     color:blue!important;
}	
20
.main .container #textid{
     color:blue!important;
}	
21
<div class="main">
 <div class="container">
  <div class="mydiv" id="textid" style="color:blue!important;">
   Text
  </div>
 </div>
</div>