Bonjour à tous. Cela fait un petit bout de temps que je cherche des solutions à ce problème récurent: mon bloc "menu" et mon bloc "contenu" s'affichent mal sous IE.
La raison ? Visiblement, un float mal interpreté ou mal placé (je ne sais pas). Voyez par vous-même sur cet exemple:
http://img507.imageshack.us/img507/3403/pbielj7.th.jpg
au lieu de:
http://img507.imageshack.us/img507/5172/pbffhv3.th.jpg
Récemment, un internaute est venu me trouver après avoir constaté le problème et m'a suggéré d'utiliser un "breaker", c'est à dire un bloc dont le seul attribut serait "clear: both;". Ca n'a pas fonctionné, mais j'ai pas mal cherché dans cette direction malgré tout... Bref, quelqu'un pourrait-il m'éclairer sur mon problème ? Car il paraît que c'est vraiment "bénin", et ça me fait râler.
Voici un cartouche (très simplifié) du code que j'utilise:
CSS
HTML
J'ai cherché sur le forum avant de poser ma bête question; j'ai essayé avec "clear", "breaker", "décalage IE", etc... Je n'ai rien trouvé de vraiment semblable à mon problème.
Merci d'avance pour votre aide =)
Modifié par mOrbide (01 Nov 2006 - 21:33)
La raison ? Visiblement, un float mal interpreté ou mal placé (je ne sais pas). Voyez par vous-même sur cet exemple:
http://img507.imageshack.us/img507/3403/pbielj7.th.jpg
au lieu de:
http://img507.imageshack.us/img507/5172/pbffhv3.th.jpg
Récemment, un internaute est venu me trouver après avoir constaté le problème et m'a suggéré d'utiliser un "breaker", c'est à dire un bloc dont le seul attribut serait "clear: both;". Ca n'a pas fonctionné, mais j'ai pas mal cherché dans cette direction malgré tout... Bref, quelqu'un pourrait-il m'éclairer sur mon problème ? Car il paraît que c'est vraiment "bénin", et ça me fait râler.
Voici un cartouche (très simplifié) du code que j'utilise:
CSS
#all /*Cadre gris entourant le contenu général*/
{
width: 960px;
min-height: 400px;
padding: 5px;
border: 3px solid #CCCCCC;
}
#header
{
width: 960px;
height: 100px;
background-image: url("../img/gfx/header.jpg");
background-repeat: no-repeat;
margin-bottom: 10px;
}
#menu /*Le bloc gauche, utilisant le float*/
{
float: left;
width: 150px;
font-size: 12px;
margin-left: 0px;
}
#breaker /* Le "breaker" que l'on m'a recommandé (mais qui ne fonctionne pas)*/
{
clear: both;
}
#corps
{
width: 790px;
min-height: 520px;
padding: 0 10px 10px 5px;
margin-left: 160px; /* Décalage du menu */
}
HTML
<div id="all">
<div id="header">
</div>
<div id="menu">
<? include("menu.php"); ?>
</div>
<div id="corps">
<? include($defaut); ?>
</div>
<div id="footer">
</div>
</div> <!-- Fin du cadre du site -->
J'ai cherché sur le forum avant de poser ma bête question; j'ai essayé avec "clear", "breaker", "décalage IE", etc... Je n'ai rien trouvé de vraiment semblable à mon problème.
Merci d'avance pour votre aide =)
Modifié par mOrbide (01 Nov 2006 - 21:33)