Changing a:hover on li:first child

Question 1

Looking at the link you provided: http://www.boards2go.com/boards/board.cgi?user=mmzjoinme

li:first-child a:hover{code here} doesn't work because the li is not the first child of its parent element. The first child of its parent element (the ul) happens to be <br> (which is not good HTML, li elements should be the only children of ul besides script-supporting elements). You can learn more about how the first-child selector works here: https://developer.mozilla.org/en-US/docs/Web/CSS/:first-child

To fix this, you can use the first-of-type selector in conjunction with some more specific targeting.

Browser Support for first-of-type: http://caniuse.com/#feat=css-sel3

CSS:

.b2g_posts_container > ul > li:first-of-type a:hover
{
    background-color: orange;
}

JSFiddle: http://jsfiddle.net/SombreErmine/4MMWP/

- or -

CSS:

ul > li:first-of-type a:hover
{
    background-color: orange;
}

li > ul > li:first-of-type a:hover
{
    background-color: transparent;
}

JSFiddle: http://jsfiddle.net/SombreErmine/4MMWP/1/

Question 2

Here's a working fiddle http://jsfiddle.net/826xZ/ using

li:first-child a:hover { border: 1px solid #000; }

Question 3

Try this, working fine. Obviously without seeing your code, it's hard to know what you mean exactly

http://jsfiddle.net/36dQz/

<html>
<head>
<style type="text/css">
ul.firstlinkhover li:first-child a:hover
{
    font-weight: bold;
    font-style: normal!important;
}
ul.firstlinkhover a:hover
{
    font-style: italic;
}
</style>
</head>

<body>
<ul class="firstlinkhover">
<li><a href="#">One</a></li>
<li><a href="#">One</a></li>
</ul>
</body>
</html>