Display: block

[Calli]

Bonjour j'ai un petit probleme avec la création d'un menu

<div class="menu">
<ul>
	<li><a href="/contact/mail.php"><img src="lettre.gif" WIDTH="30" HEIGHT="30" /></a></li>
	<li><a href="/contact/mail.php">BlablaS</a></li>
</ul>
</div>

1°) si dans ma feuille de style, je fais

.menu li a {
display: block;
border: 2px solid green;
}

j'ai bien le block qui prend la totalité de <li> donc si je clique dans le block qui contient l'image le lien se fait

parcontre si je clique sur le block qui contient les texte le lien ne se fait pas, il faut cliquer absolument sur le texte ???

normalement dans tout les tuto cette methode semble efficace, pourquoi ne marche telle pas ???

2°) si dans ma feuille de style, je fais

.menu li a {
display: block;
width : 100%;
height : 100%;
border: 2px solid green;
}

le lien fonction sur l'image et le texte mais aussi sur le cadre, mais pas sur le block.

Pourquoi cela ne fonctionne t il que sur le cadre

3°) si dans ma feuille de style, je fais

.menu li a {
width : 100%;
height : 100%;
border: 2px solid green;
}

cela fonctionne alors que dans tout les tuto on indique de transformer le block inline <a> en un block pour qu'elle occupe 100% de l'espace ???

[burinho]

si je comprend bien si tu clique après ton lien blabla ça fonctionne pas, car chez moi ca fonctionne bien.

[Calli]

oui j'ai IE6 ca devrai marcher

effectivement sur firefox ca fonctionne mais pas sous IE6

pourtant tous les tuto disent de faire un display: block

Modifié 23 Septembre 2006 par Calli

[dldstyle]

Tu as ta page en exemple en ligne ? En testant avec la web developper toolbar de Firefox, on pourrait peut être identidier le problème facilement.