:not(:first-child) and :not(:first-of-type) not working
Solution 1:
That's because they are not siblings.
If you change the :not selector to the parent div, it will work.
.someContainer:not(:first-of-type)
{
margin-top: 50px;
}
#someDivID
{
width: 400px;
}
#someItem,
#someItem2
{
border: 1px solid #000;
padding: 1px;
margin-bottom: 2px;
clear: both;
overflow: auto;
}
.someContainer
{
background-color: #0077FF;
}
.someContainer:not(:first-of-type)
{
margin-top: 50px;
}<div id="someDivID">
<div class="theBody">
<div class="someContainer">
<div id="someItem" class="someItemClass">
Test
</div>
</div>
<div class="someContainer">
<div id="someItem2" class="someItemClass">
Test2
</div>
</div>
</div>
</div>Solution 2:
As Edd above me suggested, they are not siblings - so you need to change your selector to the parent (.someContainer).
But I'd also suggest another approach, the "positive" approach - set the first child of a selector to not have the wanted properties and all the rest to have it
.someContainer:first-child {
margin-top: 0
}
.someContainer {
margin-top: 50px
}
attached Pen