.login-wrapper{
.login-field-wrapper {
color: red;
&:nth-child(2){
color: blue;
}
}
}<div class="login-wrapper">
<div class="login-field-wrapper">
Test #1
</div>
<div class="login-field-wrapper">
Test #2
</div>
</div>
<div class="login-wrapper">
<h5>New Test</h5>
<div class="login-field-wrapper">
Test #3
</div>
<div class="login-field-wrapper">
Test #4
</div>
</div>I’m wondering why does #test #3 gets the color blue instead of #4. As you can see in first example Test #2 gets blue color. The only difference is me inserting an additional element which does not have the class on which I selected it on.