Page 1 sur 1

Fixer une largeur de couleur de background (css)

Posté : 22 avr. 2008, 14:33
par ZeDeveloppeur
Bonjour tout le monde,

Dans un menu basique sur des liens j'ai mis une couleur de fond et j'aimerai pouvoir fixer la largeur de la trame de fond à 100px.

est-ce possible par les CSS ?

Posté : 22 avr. 2008, 14:42
par Victor BRITO
Une couleur d'arrière-plan occupera tout l'espace disponible pour le bloc en question, à l'exception des marges extérieures (margin).

Par conséquent, si tu veux que ta couleur d'arrière-plan occupe 100 pixels de largeur, il faut que le bloc qui le reçoive ait une largeur de 100px. Plusieurs cas de figure se présentent :

Code : Tout sélectionner

/* Élément de bloc sans padding */ div { width: 100px; background: red; } /* Élément en ligne sans padding */ span { display: block; width: 100px; background: red; }/* Élément de bloc avec padding */ div { width: 80px; padding: 0 10px; background: red; } /* Élément en ligne avec padding */ span { display: block; width: 80px; padding: 0 10px; background: red; }

Posté : 22 avr. 2008, 15:23
par ZeDeveloppeur
merci.

mon menu est constitué d'UL et de LI
j'ai mis un width fixe sur les LI mais ca n'a pas fonctionné.

effectivement tu viens de me faire remarquer que je vais galèrer à cause des margin parce que dans mon menu j'ai 4 niveau, le premier niveau n'a pas de margin mais les suivants en ont un (10,20 et 30px).

Code : Tout sélectionner

#menu UL { padding-left : 0px; margin-left : 0px; } #menu OL { padding-left : 0px; margin-left : 0px; } #menu LI.menu_r { padding-left : 0px; margin-left : 0px; list-style : url('/images/bullet_1.gif'); font-weight : bold; } #menu LI.menu_0 { padding-left : 0px; margin-left : 10px; list-style : url('/images/puce.gif'); } #menu LI.menu_1 { padding-left : 0px; margin-left : 20px; list-style : url('/images/puce.gif'); } #menu LI.menu_2 { padding-left : 0px; margin-left : 30px; list-style : url('/images/puce.gif'); } #menu LI.menu_3 { padding-left : 0px; margin-left : 40px; list-style : url('/images/puce.gif'); }
encore merci

Posté : 25 avr. 2008, 16:59
par ZeDeveloppeur
quelqu'un a une idée ? la je suis bloqué.

mettre un width et le background sur les LI ou les UL ne donne rien.

:oops: