Best way to code stackoverflow style 'questions' / 'tags' rollover buttons

button, css, html, rollover, text

Solution

There's no javascript needed for hover effects on links. Just use the :hover pseudo-class:

a:hover {
    background-color:#FF9900; 
}

Regarding the menu, it is quite common to implement navigation using unordered lists.

Problem

Whats the best way to implement rollover 'buttons' like Stackoverflow has for 'Questions', 'Tags', 'Users' at the top. It is actually implemented like this : ``` <div class="nav"> <ul class="primarynav"> <li class=""> <a href="/questions">Questions</a> </li> <li class=""> <a href="/tags">Tags</a> </li> <li class=""> <a href="/users">Users</a> </li> <li class=""> <a href="/badges">Badges</a> </li> <li class=""> <a href="/unanswered">Unanswered</a> </li> </ul> ``` I kinda gave up trying to find the javascript for this since all the javsascript seems to be on one line. I was just wondering what people think is the simplest / most reliable way to implement simple buttons like this. I found it very interesting that stackoverflow is using `<li>` and not something like `<span>`. Curious as to why... PS. I'm using ASP.NET -- currently with no other libraries such as JQuery, but willing to try something like that if it'll help.

Original source