Mes div bugs sous IE

  • Auteur de la discussion Auteur de la discussion sff
  • Date de début Date de début
J'ai encore un problème d'affichage avec le bon vieux ie 6. Pas testé sous 7.

Voila mon code:

Code:
<div style="background-image: url(images/carte/b1.gif); background-repeat: no-repeat; padding:0px; margin-bottom:0px; width:576px; height:9px"></div>  
  <div style="background-image: url(images/carte/b3.gif); width:576px; padding:0px; margin:0px; text-align:center">test<br><br>test</div>
  <div style="background-image: url(images/carte/b2.gif); background-repeat: no-repeat; padding:0px; margin:0px; width:576px; height:9px"></div><br><br>

J'ai bien indiqué 0px au niveau du padding et du margin, mais pourtant sur la première div, j'ai un espace en dessous:

bug20061217154551.JPG
 
sff a dit:
J'ai encore un problème d'affichage avec le bon vieux ie 6. Pas testé sous 7.

Voila mon code:

Code:
<div style="background-image: url(images/carte/b1.gif); background-repeat: no-repeat; padding:0px; margin-bottom:0px; width:576px; height:9px"></div>  
  <div style="background-image: url(images/carte/b3.gif); width:576px; padding:0px; margin:0px; text-align:center">test<br><br>test</div>
  <div style="background-image: url(images/carte/b2.gif); background-repeat: no-repeat; padding:0px; margin:0px; width:576px; height:9px"></div><br><br>

J'ai bien indiqué 0px au niveau du padding et du margin, mais pourtant sur la première div, j'ai un espace en dessous:

bug20061217154551.JPG

si tu veux, tu peux faire un " bidouillage "...

le second div tu lui colle une marge negative : margin-top:-1px ou -2 px...

et ton probleme sera réglé.

je donne cette solution car il peut y avoir x raisons à ton soucis et x solutions.
 
Oui ca fonctionne, et on peu ajuter correctement pour ie 6, mais par contre sur tous les autres navigateurs qui sont logique comme firefox, je me retrouve avec un réel margin - 2 , donc il me manque une partie de l'image.

C'est pas le meilleur solution à mon avis, mais la je ne vois vraiment pas d'ou ca peut venir.
 
dans ce cas la css devient

_margin_top:-2px;

et elle ne sera interpretée que par IE.

Sinon verifie qu'il n'y ait pas de retour chariot dans ton code ou une hauteur definie etc....
 
La marge négative est à éviter et le hack aussi car il ne sera pas lu par ie7 en mode Standards Compliance.
Il faut une classe à tes div puis ajouter dans la feuille de style
.classeaffectee img {vertical-align:bottom;)
 

➡️ Offre MyRankingMetrics ⬅️

pré-audit SEO gratuit avec RM Tech (+ avis d'expert)
coaching offert aux clients (avec Olivier Duffez ou Fabien Faceries)

Voir les détails ici

coaching SEO
Discussions similaires
Haut