How do I target the first link inside a div with CSS?

css pseudo-class targeting

Danny Cooper · Nov 8, 2012 · Viewed 11.8k times · Source

For example I have this:

<div>
  <a href="#">sample 1</a>
  <a href="#">sample 2</a>
  <a href="#">sample 3</a>
</div>

I want to target the first link with CSS.

Answer

You can use the first-child selector:

div > a:first-child { /* your css */ }