How do I select the first adjacent sibling?

Question

I have an HTML list like so:

  
Heading 1
  


        

Answer 1

try using JS to getElementsby Classname and if more than 1 then use CSS:

ul li:first-child {display: none;}

Answer 2

This is now possible

li:first-of-type {
    display: none;
}

This will match the first li tag.

li:first-of-type:not(:only-of-type) {
    margin: 10px;
}

If you want a bit more control - such as adding space between two items only when there are more items the above would work. Mixing pseudo selectors can be very powerful. https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes