28220 sujets

CSS et mise en forme, CSS3

[RESOLU]Background image de 25px derriere une element de liste

bonjour

j'aimerai mettre une image de fond derriere mon menu

comme ca :
http://fab.realone.free.fr/menu.gif

voila ce que jai pour l'instant
http://fab.realone.free.fr/menu2.gif

j'ai colorié en vert le background de mes li pour visualiser l'espace occupé par le li

le probleme est que mon element li n'est pas assez haut, pour afficher mon carre orange de 25px
j'ai essayé avec line-height , height mais ca ne marche pas !

comment puis je faire?
Modifié par Dynexd (25 Jan 2007 - 10:10)
Merci pour ta vitesse de réaction ^^
Shit , dommage ca marchait nickel sour firefox, mais en fait ie lui n'en veut pas Smiley ohwell
Ca y est j'ai réussi en appliquant un height: 25 px ; à mon <ul> et un padding-bottom a mon <li>

Merci de ton aide ! Smiley smile

Mais en fait jsuis confronté a un autre probleme maintenant, je souhaite changer mon image de 25 px , quand la souris survole un lien du menu

or pour faire cela il faudrait que l'image ne soit pas sur le li mais li a{}
et l'autre image sur le li a:hover{}
or je n'arrive pas ni vec height ni avec padding ni avec line-height a augmenter le hauteur de mon a et donc j'ai le mm probleme qu'au debut c'est a dire que l'mage ne s'affiche pas entierement
Modifié par Dynexd (13 Apr 2006 - 16:51)
hummm le probleme semble résolu
en fait j'ai du mettre mes a en display:block pour pouvoir leur donner une taille et donc mettre ue image plus grande, et comme le inline ne peux pas avoir de type block a l'interieur jai remplacé le display : inline (appliquée a mes li) pour mon menu horizontal par un float :left

http://www.oltana.net/forum/viewtopic.php?p=14642

:D
je met en RESOLU des que ca marche ^^
En identifiant le lien cliqué, ca doit être possible, je l'ai fait pour la couleur du lien sur ce site.

Pour ce faire, j'ai appliqué une "id" au "body", exemple :


<body id="accueil">


Ensuite, j'aplique un autre "id" au lien, ici :


<a href="#" id="acceuilnav">...</a>


Pour ma CSS, ca donne ça :


body#accueil a#accueilnav {
color : #ff6600;
}


Il faut répéter l'opération en changeant les "id" sur chaques pages, sur ma CSS, ca donne ca (j'aurais pu en faire une classe, lol) :


body#accueil a#accueilnav,
body#produits a#produitsnav,
body#contact a#contactnav,
body#privat a#privatnav,
body#phcnb a#phcnbnav,
body#phcc a#phccnav,
body#tlc a#tlcnav,
body#info  a#infonav,
body#mobi a#mobinav,
body#conso a#consonav,
body#caisse a#caissenav
body#privatadd a#privataddnav,
body#privatsupp a#privatsuppnav,
body#privatmodif a#privatmodifnav,
body#riso a#risonav {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    color:#FF6600;
    font-weight:bold;
    text-decoration: underline;
}


Maintenant, plutot que l'appliquer a "a", tu l'aplique a "li". Théoriquement, ca devrait marcher, je n'ai pas éssayé.
Modifié par TheReverendEVIL (13 Apr 2006 - 17:26)
Sujet clos
Aller à