Bonjour.
Je me permet d'ouvrir un thread car j'aimerais avoir votre opinion.
La première fois que j'ai vu un menu horizontal construit avec des <li>, j'ai trouvé celà très astucieux. Néanmoins, les problèmes de compatibilité entre les navigateurs soulèvent des problèmes.
En effet, les balises <ul> et <li> sont spécialisées, et leur utilisation implique de surcharger des propriétés comme celle qui gère les puces.
La question que je me pose est, pourquoi n'utilise t'on pas simplement des <div> en remplacement. En effet, les <div> sont d'utilisation plus générale, et plus facile à vivre.
Ainsi, un menu peut être défini comme suit:
et les styles css comme suit:
version menu vertical
version menu horizontal
... seule la propriété display est choisie entre block et inline
On limite grandement les différentes interprétations entre les navigateurs.
Qu'en pensez-vous ? et que voyez vous comme inconvénients...
Je me permet d'ouvrir un thread car j'aimerais avoir votre opinion.
La première fois que j'ai vu un menu horizontal construit avec des <li>, j'ai trouvé celà très astucieux. Néanmoins, les problèmes de compatibilité entre les navigateurs soulèvent des problèmes.
En effet, les balises <ul> et <li> sont spécialisées, et leur utilisation implique de surcharger des propriétés comme celle qui gère les puces.
La question que je me pose est, pourquoi n'utilise t'on pas simplement des <div> en remplacement. En effet, les <div> sont d'utilisation plus générale, et plus facile à vivre.
Ainsi, un menu peut être défini comme suit:
<div class="mon_menu">
<div><a href="#">Première option</a></div>
<div><a href="#">Deuxième option</a></div>
<div><a href="#">Troisieme option</a></div>
</div>
et les styles css comme suit:
version menu vertical
.mon_menu {text-align:left;width:80%;background-color:inherit}
.mon_menu div {padding-bottom:4pt;display:block}
.mon_menu a {text-decoration:none; font-family:tahoma; font-size:8pt; font-weight:bold; color:navy; padding-left:10pt; padding-right:10pt}
.mon_menu a:hover { background-color:yellow;color:white}
version menu horizontal
.mon_menu {text-align:left;width:80%;background-color:inherit}
.mon_menu div {padding-bottom:4pt;display:inline}
.mon_menu a {text-decoration:none; font-family:tahoma; font-size:8pt; font-weight:bold; color:navy; padding-left:10pt; padding-right:10pt}
.mon_menu a:hover { background-color:yellow;color:white}
... seule la propriété display est choisie entre block et inline
On limite grandement les différentes interprétations entre les navigateurs.
Qu'en pensez-vous ? et que voyez vous comme inconvénients...