28173 sujets

CSS et mise en forme, CSS3

Bonjour à vous,

Après de nombreuses recherches portant sur le même sujet (mais dont le solutions ne fonctionnent apparemment pas chez moi) je me permets d'ici poster.

Je voudrais que mes liens de la div appelée "sommaire" soient cliquables sur toute leur longueur. Avec Firefox, aucun problème, mais avec IE6 par contre... J'ai lu dans la FAQ qu'une balise <dt> ne pouvait contenir d'éléments blocs (Pourquoi en fait?!). Je pensais que ça pouvait être une réponse, mais en remplaçant par une balise <dd>, aucun changement. Marche sur FF. Marche pas sur IE. J'ai aussi lu que je devais attribuer une valeur height, par exemple height:1%, ça n'y change rien non plus ou même line-height:1%.

HTML
<div id="sommaire"><h1>Sommaire</h1>
						
						<dl id="liste_sommaire">
							<dt><a href="#musique">Musique et chants à Juazeiro</a></dt>
							<dt><a href="#livro">Livro Em roda</a></dt>
							<dt><a href="#congo">École et famille au Congo</a></dt>
							<dt><a href="#vietnam">Enseignement et école du coeur au Vietnam</a></dt>
						</dl>
						
				  </div>


Et le CSS
/* Liens dans la partie sommaire, avec comme particularité que toute la ligne s'illumine en hover */
#liste_sommaire a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #006600; 
    display: block;
    width: 100%;

}

#liste_sommaire a:hover {
    color: #FFFFFF;
    background-color: #A4AA80;
    display:block;
    width: 100%;

}

/* Fin de ces liens */


Un tout grand merci d'y jeter un oeil...

Manu
Modifié par manuwatt (08 Aug 2007 - 01:02)
Merci d'avoir répondu si vite.

Bon, murf, suis perplexe là. Et en allant sur cette page-ci http://www.kundera.be/Congreg2/pages/education.html là aussi les liens du sommaire sont cliquables sur toute la longueur de la ligne?

Comment peut-on expliquer que ça ne fonctionne pas chez moi? Des interférences sont-elles possibles avec une autre partie du CSS que je n'aurais pas mis ici? Et, question subsidiaire, pourquoi ne pas mettre d'éléments blocs dans <dt>?

Tout grand merci,

Manu
Re,

Sur ta page, ça ne passe pas, surement à cause du float de ton conteneur.
Pour y remédier,
#liste_sommaire a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	color: #006600; 
        display: block;
background: #fff;/*--------- Pour ie7&6 -----------*/
height: 1%;/*------------ Pour ie6 (haslayout) -------------------*/
}

#liste_sommaire a:hover {
    color: #FFFFFF;
    background-color: #A4AA80;
}


Sacré IE Smiley biggol
Un tout tout grand merci Ghost! C'est ok maintenant.

J'espère un jour pouvoir moi aussi être de ceux qui aident!

Et, effectivement, sacré IE...