28221 sujets

CSS et mise en forme, CSS3

Voila, j'aimerai bien que les puces soient décallées de 5 pixels en partant de la gauche dans le bloc.

Actuellement, elles sont collés sur la gauche :

#gauche a
{
margin: 0px;
padding: 0px;
width: 130px;
text-decoration: none;
background-image: url(http://damien.klotz.free.fr/images/site/puce_orange.gif);
background-position: left center;
background-repeat: no-repeat;
text-indent: 10px;
display: block;
}

#gauche a:hover
{
text-decoration: none;
background-image: url(http://damien.klotz.free.fr/images/site/puce_rouge.gif);
background-position: left center;
background-repeat: no-repeat;
background-color: #ffa500;
}
Administrateur
utiliser le raccourci est plus pratique et passe mieux sous certains navigateurs (ex : Konqueror)

background: #ffa500 url(http://damien.klotz.free.fr/images/site/puce_rouge.gif) no-repeat 5px 50%;
Directement de mes sources...

ul { 
   line-height: 1.4em; 
   padding: 0; 
   margin: 0 0 0.5em 0; 
   list-style-type: none; 
}

ul li a { 
   background: transparent url("images/bulletoff.gif") top left no-repeat; 
   padding: 0 0 0 18px; 
}

ul li a:hover { 
   background: transparent url("images/bullethover.gif") top left no-repeat; 
   text-decoration: none; 
}


Si tu veux une marge avant la puce, tu peux l'ajouter directement sur l'image ou changer les valeurs margin ou padding de <ul>.
Modifié le 01 Nov 2004 - 22:12