Bonjour tout le monde !
Débutant le css , j'ai quelques problèmes:
Un <div> contient 3 liens sous forme d'images <a><img src="" /></a> avec des marges pour les positionner.
1) Déjà: petit problème : j'ai remarqué que si je ne met pas les <a> a la suite des autres j'ai des espacements dans ie6 et FF.
Ca beug avec ca:
Et ca ne beug plus avec ca :
2)Mon plus gros probléme est celui de la largeur de mon <div>
(un <div> avec une bordure de 1px)
Quand je lui fixe une largeur comme width 498px
après capture d'écran et vérification sur photoshop:
je retrouve bien 498px sur FF de contenu
et 496px sur ie6
je croyais que ie6 avait été corrigé pour les width des boites
Ayant fait une présentation au pixel près je me retrouve avec des retours à la ligne de mes <a> sur ie6
je ne sais pas si j'ai été tres clair :
voici mon code pour mieux comprendre
et mon code html
Débutant le css , j'ai quelques problèmes:
Un <div> contient 3 liens sous forme d'images <a><img src="" /></a> avec des marges pour les positionner.
1) Déjà: petit problème : j'ai remarqué que si je ne met pas les <a> a la suite des autres j'ai des espacements dans ie6 et FF.
Ca beug avec ca:
<div>
<a></a>
<a></a>
<a></a>
</div>
Et ca ne beug plus avec ca :
<div>
<a></a><a></a><a></a>
</div>
2)Mon plus gros probléme est celui de la largeur de mon <div>
(un <div> avec une bordure de 1px)
Quand je lui fixe une largeur comme width 498px
après capture d'écran et vérification sur photoshop:
je retrouve bien 498px sur FF de contenu
et 496px sur ie6
je croyais que ie6 avait été corrigé pour les width des boites
Ayant fait une présentation au pixel près je me retrouve avec des retours à la ligne de mes <a> sur ie6
je ne sais pas si j'ai été tres clair :
voici mon code pour mieux comprendre
/*Parametres des zones 2-3-4-5-6 */
#zone_2_3_4_5_6{
border: 1px solid #CBD9EE;
background-color: #E7EDF2;
width:498px;
/*IE 6 500 ??? */
}
/*Parametres des images des zones 2-3-4-5-6 */
#zone_2_3_4_5_6 img{
border: 1px solid #CBD9EE;
}
/*Positions des zones 2-3-4-5-6 */
#zone_2{
margin: 10px 10px 0 10px;
}
#zone_3{
margin: 10px 0 0 0;
}
#zone_4{
margin: 10px 11px 10px 11px;
}
#zone_5{
margin: 10px 0 10px 0;
}
#zone_6{
margin: 10px 10px 10px 10px;
}
et mon code html
<div id="zone_2_3_4_5_6">
<a href=""><img src="img/produit10.jpg" width="232" height="185" id="zone_2" /></a><a href=""><img src="img/produit10.jpg" width="232" height="185" id="zone_3" /></a>
<a href=""><img src="img/produit11.jpg" width="150" height="150" id="zone_4" /></a><a href=""><img src="img/produit11.jpg" width="150" height="150" id="zone_5" /></a><a href=""><img src="img/produit11.jpg" width="150" height="150" id="zone_6" /></a>
</div>
