28172 sujets

CSS et mise en forme, CSS3

Aligner des images sans retour a la ligne

bonjour

Je suis en train de faire une barre de navigation en images avec des rollovers mais ces images retournent à la ligne alors qu'elles devraient rester alignés. Est ce que que quelqu'un a une idée ?

Merci d'avance

<div>
<a id="led" href="/led-neon/Neons" title="Led"><span>Led</span></a>
<a id="neon" href="/led-neon/Neons" title="Néons"><span>Néons</span></a>
<a id="eclairage" href="/led-neon/Complement-d-eclairage" title="Complément d'éclairage"><span>Complément d'éclairage</span></a>
<a id="label" href="/led-neon/Le-label-Yaki" title="Le label Yaki"><span>Le label Yaki</span></a>
<a id="contact" href="/antispam/contact.php" title="Contact"><span>Contact</span></a>
<a id="clients" href="http://www.hebergementk.fr:8002/" title="Espace Clients"><span>Espace Clients</span></a>
</div>



#led
  {
    display: block;
    width: 91px;
    height: 43px;
    background: url("/led-neon/interface-yaki/led-i.gif") no-repeat 0 0;
  }

#led:hover
  { 
    background-position: 0 -23px;
  }

#led span
  {
    display: none;
  }

#led:hover
  { 
    background: url("/led-neon/interface-yaki/led-a.gif") no-repeat 0 0;
  }

#neon
  {
    display: block; left : 92px; 
    width: 105px;
    height: 43px;
    background: url("/led-neon/interface-yaki/neon-i.gif") no-repeat 0 0;
  }

#neon:hover
  { 
    background-position: 0 -23px;
  }

#neon span
  {
    display: none;
  }

#neon:hover
  { 
    background: url("/led-neon/interface-yaki/neon-a.gif") no-repeat 0 0;
  }

#eclairage
  {
    display: block;
    width: 244px;
    height: 43px;
    background: url("/led-neon/interface-yaki/complement-i.gif") no-repeat 0 0;
  }

#eclairage:hover
  { 
    background-position: 0 -23px;
  }

#eclairage span
  {
    display: none;
  }

#eclairage:hover
  { 
    background: url("/led-neon/interface-yaki/complement-a.gif") no-repeat 0 0;
  }

#label
  {
    display: block;
    width: 154px;
    height: 43px;
    background: url("/led-neon/interface-yaki/label-i.gif") no-repeat 0 0;
  }

#label:hover
  { 
    background-position: 0 -23px;
  }

#label span
  {
    display: none;
  }

#label:hover
  { 
    background: url("/led-neon/interface-yaki/label-a.gif") no-repeat 0 0;
  }

#contact
  {
    display: block;
    width: 123px;
    height: 43px;
    background: url("/led-neon/interface-yaki/contact-i.gif") no-repeat 0 0;
  }

#contact:hover
  { 
    background-position: 0 -23px;
  }

#contact span
  {
    display: none;
  }

#contact:hover
  { 
    background: url("/led-neon/interface-yaki/contact-a.gif") no-repeat 0 0;
  }

#clients
  {
    display: block;
    width: 184px;
    height: 43px;
    background: url("/led-neon/interface-yaki/client-i.gif") no-repeat 0 0;
  }

#clients:hover
  { 
    background-position: 0 -23px;
  }

#clients span
  {
    display: none;
  }

#clients:hover
  { 
    background: url("/led-neon/interface-yaki/client-a.gif") no-repeat 0 0;
  }
Sujet clos
Aller à