Forum d'entraide PHPFrance

Bonjour,

j'ai un tableau en html qui contien des liens.
Les liens ont une classe CSS qui mets une image de fond derrière.
Sous IE cela passe très bien. Alors que sous FireFox mes images sont coupées et sont mise de la taille du texte du lien.
Aussi il y a un retour à la ligne dans un lien que j'aimerai éviter (sous IE il n'est pas là).

Voici la classe CSS:

.sousmenu{
background: url(image/Sous-menu/ssmenu.jpg);
background-repeat: no-repeat;
width:200px;
line-height:20px;
color: #ffffff;
}
.sousmenu:hover{
background: url(image/Sous-menu/ssmenu2.jpg);
background-repeat: no-repeat;
width:200px;
line-height:20px;
text-decoration: none;
color: #104C82;
}


comment faire pour que mon image soit entière ?


merci

peut-être en ajoutant un height : 20px; en plus du line-height...?
Je suis pas sûr...

Non ca ne change rien.

Le problème c'est que FireFox considère réelement l'image de background comme un background. Et la classe CSS est attribué à un lien.
Et on ne pex pas redimensionner un lien.

Je cherche une astuce pour avoir le meme rendu visuel que sous IE.

J'ai essayé de mettre la classe dans la cellule du tableau, et là le prob c'est que le rollver ne se déclenche pas car on ne peut pas par un rollover sur une cellule de tableau.

alors laisse la classe sur le lien, mais ajoute une classe qui dimensionne ta cellule de tableau et éventuellement pour forcer la taille, mets un pixel transparent de 20px de haut dans une cellule supplémentaire en bout de ligne. (Ça signifie que tout ton tableau aura une colonne de plus)

<a> est une balise de type inline au meme titre que <b>, <i>, <span> etc ...

Ces balises inline n'ont pas de dimensions : elles s'adaptent automatiquement au texte qu'elles contiennent.

Pour pouvoir definir une hauteur, une largeur ainsi que bien d'autres attributs il faut utiliser des balises de type block.

La solution est donc de faire adopter un comportement de type block a tes balises <a> en ajoutant dans ton CSS la propriete display:block; a tes classes de liens.

Merci bcp, c'est exactement ce que je cherchais !

Merci pour ce post il m'a etait tres utile.