Immagine di navigazione Utilizzando text-trattino

Question

Sto cercando di creare un semplice navigazione tra le immagini per il mio sito, usando i CSS per dichiarare la proprietà background-image di una lista-item (Li). Il problema è che, quando uso text-indent mettere l'immagine off-screen, il collegamento non c'è più (fuori campo così presumo). Qualsiasi aiuto sarebbe molto apprezzato. Ecco il mio XHTML:

<div id="nav">
  <ul>
    <li class="current about">
      <a href="#about" title="about">about</a>
    </li>
    <li class="contact">
      <a href="#contact" title="contact">contact</a>
    </li>
    <li class="networks">
      <a href="#networks" title="networks">networks</a>
    </li>
  </ul>
</div>

Ecco la mia CSS:

#nav li {
   display: block;
   float:left;
   background-image: url("images/nav-normal.png");
   height:47px;
   text-indent: -9999px;
}

Ho anche creato sfondo posizioni per i singoli list-elementi perché sto utilizzando sprite . Grazie in anticipo!

Answer 1

applicare tale stile al #nav li a. In caso contrario, tutto all'interno della li, compreso il collegamento, viene spostata fuori dallo schermo.