I feel like this should work, if you can say #foo p:first-child why does #foo hr:first-child not work. If anyone can explain this one I’d really appreciate it.
I’ve setup a JSFiddle demo here – http://jsfiddle.net/mGu7x/6/
Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
None of the
<hr>elements are the first-child of their parent element.See this updated demo which makes the border more obvious and moves the hr to the top.
You might want to look at
:first-of-typewhich is new in CSS 3 and does what you appear to be looking for. (Can I Use suggests that it has wide support outside of non-current-IE).See a demo using
:first-of-type(which I have only tested in Chrome).