[CSS] probleme affichage tableau IE

Résolu/Fermé
fraid Messages postés 42 Date d'inscription vendredi 18 avril 2008 Statut Membre Dernière intervention 29 mars 2009 - 11 sept. 2008 à 06:42
fraid Messages postés 42 Date d'inscription vendredi 18 avril 2008 Statut Membre Dernière intervention 29 mars 2009 - 14 sept. 2008 à 07:05
Bonjour,
voila j'ai créé un tableau en CSS qui s'affiche parfaitement sous FF, mais pas sous IE,
le code est super simple je ne comprend vraiment pas le problème !

le tableau est en trois partie : haut,milieu,bas. chacun avec un image de fond...
le probleme est que IE m'affiche le div haut et bas un peu plus grand que prévu du coup l'image de fond se répète. Si je met no-repeat, elle ne se répète pas mais j'ai unblanc dans la bordure du tableau, ce que je veux absolument éviter.

voici le code :

div.men_haut
{
display: block;
width: 208px;
height: 14px;
margin-top: 20px;
background: url(men_h.png);
}
div.men_milieu
{
display: block;
width: 208px;
background: url(men_m.png) repeat-y;
}
div.men_bas
{
display: block;
width: 208px;
height: 14px;
background: url(men_b.png);
}


et mon tableau :


<div class="men_haut"></div>
<div class="men_milieu">ici le contenu de mon tableau</div>
<div class="men_bas"></div>



voila je ne voit vraiment pas d'ou vient l'erreur !!

merci d'avance !!
A voir également:

2 réponses

Mimiste Messages postés 1149 Date d'inscription samedi 17 mai 2008 Statut Membre Dernière intervention 6 mars 2016 206
11 sept. 2008 à 09:54
Bonjour

Il faut regler la propriété css "line-height: 14px;" a chaque fois car par defaut une ligne fais plus de 14px de hauteur et du coup il adpate la div

Autre chose il ne faut pas laisser une div vide, si tu n'a pas de texte a ecrire dedans il faut mettre un   pour qu'il cré quand même une ligne

div.men_haut
{
display: block;
width: 208px;
height: 14px;
margin-top: 20px;
background: url(men_h.png);
line-height: 14px;
}
div.men_milieu
{
display: block;
width: 208px;
height: 14px;
background: url(men_m.png) repeat-y;
line-height: 14px;
}
div.men_bas
{
display: block;
width: 208px;
height: 14px;
background: url(men_b.png);
line-height: 14px;
}

<div class="men_haut"> </div>
<div class="men_milieu">ici le contenu de mon tableau</div>
<div class="men_bas"> </div>

Normalement ça marche
1
fraid Messages postés 42 Date d'inscription vendredi 18 avril 2008 Statut Membre Dernière intervention 29 mars 2009 5
14 sept. 2008 à 07:05
j'ajoute juste qu'il fallait réduire la taille de la police aussi :

font-size: 0pt;

sinon cela ne marchait pas.

merci pour l'indication !!
1