How to select first a element of li with CSS?

Question

I'm trying to select the first anchor tag of a nested li menu tree: ```

``` What I'm trying to accomplish is to select only the first anchor tag of the main menupoints. My css is: ``` div.footermenu li.expanded a:first-child { font-weight: bold; } ``` The problem is that this CSS still selects the submenupoints and I don't know why.

Accepted Answer

You want to use `div.footermenu li.expanded > a:first-child`

jsFiddle

http://jsfiddle.net/eRTV6/

```
div.footermenu li.expanded > a:first-child {
    font-weight: bold;    
}
```

Your original selector will select all anchor elements which are first-children of `li.expanded`, by adding a direct descendant selector, `>`, you specify that you only want to select the first, direct descendant of `li.expanded` which are anchors.

How to select first a element of li with CSS?

Solution

Problem