Question

I can’t get my head round why this first-child selector isn’t working.

I’ve created a jsFiddle to show my code: http://jsfiddle.net/wDTvV/

Basically the following CSS rule isn’t working:

.form-item-products:first-child {
  display: none;
 }

Does anyone know why? Have I screwed up my syntax for using pseudo selectors?

Thanks guys,

Rick

Answer 1

The first child is not a .form-item-products, but rather #product-guide-wrapper, so your selector won’t match.

As SLaks has mentioned, there isn’t a :first selector in CSS like jQuery’s. Given your structure, however, you should be able to use #product-guide-wrapper + .form-item-products instead.