title: How do I keep a menu link highlighted (as bold and blue) after clicking on it?
body: <p>I've got a header menu on my page (<a href="http://www.wortwaerts.net" rel="nofollow">www.wortwaerts.net</a>) that works fine on the basis of the code below apart from one issue I could not find a solution for so far: I'd like the menu link that was clicked last to stay highlighted (bold and blue) until another link is chosen which will then be highlighted in the same way. I've already studied some related requests/ answers on this page but couldn't implement the advices successfully (most included javascript) - I'm really a starter as to web development and would be very happy about any hint described in a "foolproof" way ;o) </p>
  
  <p>Thanks a lot for your ideas! Cheers, Felix</p>
  
  <pre><code>#screen &gt; header a{
     color:#000 !important;
     display:block;
     text-decoration:none
  }
  
  #screen &gt; header a:hover{
     color:#19175C !important;
     text-decoration:none;
     font-weight:bold;
     background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAGCAAAAADBUmCpAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAHklEQVQIHWOI/PT/P4MxkGQwNra/CSV8bv5nAEkAANIFDmMxRyBPAAAAAElFTkSuQmCC) 0 50% no-repeat;
     background-size:.25em .375em;
     -moz-background-size:.25em .375em;
     -webkit-background-size:.25em .375em;
     font-weight:bold;
     margin-left:-.75em;
     padding-left:.75em
  }
  
  #screen &gt; header strong a{
     background:transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAGCAAAAADBUmCpAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAHklEQVQIHWOI/PT/P4MxkGQwNra/CSV8bv5nAEkAANIFDmMxRyBPAAAAAElFTkSuQmCC) 0 50% no-repeat;
     background-size:.25em .375em;
     -moz-background-size:.25em .375em;
     -webkit-background-size:.25em .375em;
     font-weight:400;
     margin-left:-.75em;
     padding-left:.75em
  }
  
  .ielt8 #screen &gt; header strong a{
     background-image:url(assets/img/bg-bullet.png)
   }
  </code></pre>