Suppose we have two divs

<div class="one"> <div class="two"></div> </div> 

How correctly to specify styles for div two? I have seen several ways and still do not know which one is correct.

 .one.two{} .one .two{} .one > .two{} 
  • I would answer, but you do not accept your answers. - Excess Susliks
  • All but the first - E_K
  • 2
    True and correct entries: .two , .one .two , .one > .two , the difference is only in the weight of the selectors. Article - css.yoksel.ru/specifity - HamSter

2 answers 2

in such a situation, it is best to point to the direct style .two{} or in extreme cases .one .two{} or .one > .two{} .

This is not true .one.two{} - this is appropriate for the situation <div class="one two"></div>

    1. .one.two {} - in this case, the entry should be of this type. <div class="one two"></div> , if there is nesting, the styles will not work.
    2. .one .two {} - selects all <div class="two"></div> that are inside <div class="one"></div> any nested works
    3. .one> .two {} - selects all <div class="two"></div> that are descendants of <div class="one"></div>