I have this nested html
i want to access the second sibling, whose parent is div of class "x"
i tried using
.x div:nth-child(2) {
padding-bottom: 30px;
margin-bottom: 30px;
}
<div class="x">
<div>.....</div>
<div> The One i want to change it's style</div>
</div>
The code works.
>Solution :
Its working, please see below. I have also added a child selector > . But without that also it should work.
.x > div:nth-child(2) {
padding-bottom: 30px;
margin-bottom: 30px;
border: 1px solid red;
color:red;
}
<div class="x">
<div>.....</div>
<div> The One i want to change it's style</div>
<div>third div</div>
</div>