html - Can I combine direct descendant with first-child pseudo-selector? -


i've got container div contain number of children. want target links direct descendants of container div, , can .container > a. then, want give different styling first link direct descendent of container. assumed .container > a:first-child perform task, seem not.

note using .container a:first-child target first 2 "incorrect" links, can't use that, don't think.

obviously can rework structure of html, i'd see if there's css solution here.

<!doctype html> <html lang="en">     <head>         <style>             .container >             {                 background-color: plum;             }              .container > a:first-child             {                 background-color: pink;             }         </style>     </head>      <body>         <div class="container">             <div><a href="#">incorrect link</a></div>             <div><div><a href="#">incorrect link 2</a></div></div>             <p>some text</p>             <a href="#">category 1</a>             <a href="#">category 2</a>             <a href="#">category 3</a>         </div>     </body> </html> 

you can use .container > a:first-of-type

jsfiddle : http://jsfiddle.net/cp7jz/


Comments

Popular posts from this blog

blackberry 10 - how to add multiple markers on the google map just by url? -

php - guestbook returning database data to flash -

delphi - Dynamic file type icon -