How to make a link stay active in CSS?

Basically I want the hover-look of a link stay active when you're on that site. I hope I'm explaining this right. There's supposed to be a background behind the link when you're visiting that specific page.

Here's the code for the html:

<div class="menudiv">
<div id="menu">
    <ul id="menu">
      <li><a href="?p=start"><span>Hem</span></a></li>
      <li><a href="?p=omoss"><span>Om oss</span></a></li>
      <li><a href="?p=tjanster"><span>Tjänster</span></a></li>
      <li><a href="?p=referenser"><span>Referenser</span></a></li>
      <li><a href="?p=kontakt"><span> Kontakt</span></a></li>
    </ul>
  <div class="clr"><开发者_StackOverflow;/div>
  </div>
  </div>

And here's the css:

#menu { float:right; padding:23px 0 0 0; margin:0; width:420px; height:35px;}
#menu ul { text-align:right; padding:0; margin:0; list-style:none; border:0; height:35px;}
#menu ul li { float:left; margin:0; padding:0 5px; border:0; height:35px;}
#menu ul li a { float:left; margin:0; padding:10px 0; color:#5c8783; font:normal 12px Arial, Helvetica, sans-serif; text-decoration:none;}
#menu ul li a span { padding:10px 13px; background:none;}
#menu ul li a:hover { background:url(images/r_menu.gif) right no-repeat;}
#menu ul li a:hover span { background:url(images/l_menu.gif) left no-repeat;}
#menu ul li a:active { background:url(images/r_menu.gif) right no-repeat;}
#menu ul li a:active span{ background:url(images/l_menu.gif) left no-repeat;}

---

Add a CSS class for the that link (eg, <a class="CurrentPage">), then apply the selector to that class (eg, #menu ul li a:active, a.CurrentPage)

---

As much I know the hover property should put last in CSS (below the active and others) in order to work properly.

---

you are giving same id :

  <div id="menu">
     <ul id="menu">

which is wrong

you should make ids different.

---

What you basically need is to add a css class to the a tag in your menu. example:

<li><a href="?p=start" class="currentPage"><span>Hem</span></a></li>

add styling to your currenPage class as per the designs you want for that menu item

now, your page should be dynamic for you to be able to set the currenPage css class to the current menu item where the user is currently viewing

example:

<li><a href="?p=start" class="<?php if(/**check if the user is in this link/menu item**/) echo "currentPage"; ?>" ><span>Hem</span></a></li>