CSS first-child not working on site, but works on CodePen?

[Presto]

Hey guys,

This is my very first post on here, I prefer to search over starting new threads but I’m really stumped on this one. I have a bit of CSS that works on CodePen how I want it but if I add it to my site it stops working. What I’m trying to do is simple, set a left margin on all ul lists, then remove the left margin for the first ul using first-child, simple right? That’s what I thought but I must be missing something as it’s not working on my site and its driving me crazy. Would you take a look and see if you see what I’m missing here?

Thanks guys.

http://codepen.io/Presto/pen/paGnj
http://www.interfacetour.com/evites.html?e=1&r=43

[TheDoc]

That’s because on your website there is no `

` that is first child. The first child of `#description` is actually this:

Included in your INTERFACE Experience:

[Kitty Giraudel]

Don’t confuse :first-child and :first-of-type. I think you meant the latter. :)

[Presto]

Thanks for the codepen Krish1980
*sigh* you are correct TheDoc, HugoGiraudel, yeah I was using :first-of-type at the start and that worked really well, but I needed to make it IE7 friendly, so should I just add a class to that first ul and style that class? basically everything within the description div is editable with a wysiwyg text editor from the backend by the board of directors of the event, and they do not know coding at all, so if they update the description content and remove the first ul and then add it back in they end up braking the layout because the ul with the class was removed and added backin without the class applied to it, so I was trying to future proof the description layout. But I guess I will have to apply a class to that first ul to make IE7-8 happy.

http://codepen.io/Presto/pen/jExhK

[rosspenman]

You could always try [Selectivzr](http://selectivizr.com), which is a JavaScript polyfill that brings support for advanced selectors to Internet Explorer. That will allow you to use `:first-of-type`.

[Author]

Posts