[Résolu] Prblème avec float et des <div> - mais seulement avec IE... par socomajor - page 1

<!DOCTYPE html PUBLIC "–//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1–strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Index du site</title>
<meta http–equiv="Content–Type" content="text/html; charset=iso–8859–1" />
<link rel='stylesheet' href='theme/theme2.css' type='text/css' title='Theme1' />
</head>
<body>

<!–– Ici on met l en tête de la page––>

<div id='en_tete'>
</div>

<!–– Ici on met les différents menus ––>
<div id='menus'>
<div class='menu'>
<div class='haut'>Général</div>
<div class='centre'>
<ul>
<li><a href='#'>Lien 1</a></li>

<li><a href='#'>Lien 2</a></li>
</ul>
</div>
<div class='bas'></div>
</div><div class='menu'>
<div class='haut'>secondaire</div>
<div class='centre'>
<ul>

<li><a href='#'>Lien 1</a></li>
<li><a href='#'>Lien 2</a></li>
</ul>
</div>
<div class='bas'></div>
</div></div>

<!–– Ici on met le corps ––>
<div id='corps'>
<div class='haut_gauche'>

<div class='haut_droite'>
<div class='haut_centre'></div>
</div>
</div>
<div class='centre_gauche'>
<div class='centre_droite'>
<div class='centre_centre'>
<p>Bonjour et bienvenue sur la nouvelle version de mon site !<br />
Comment qu'tu vas ?</p>

<p>Bon au fait le problème tu vois c'est que avec IE‚ ce cadre est en dessous des menus et ça c'est pas très très normal ou est le problème ?</p>

</div>
</div>
</div>
<div class='bas_gauche'>
<div class='bas_droite'>
<div class='bas_centre'></div>
</div>
</div>

</div>
</body>
</html>

body
{
background:#d8f8d1;
}

p
{
margin:0;
}

ul
{
margin:0px;
list–style–image:url('puce.png');
list–style–position:outside;
padding:0px;
padding–left:40px;
}
h1
{
margin:0px;
}

/*EN TETE*/
#en_tete
{
height:100px;
width:426px;
background:url('logo/logo.png') no–repeat;
margin:auto;
}

/*MENUS*/
#menus
{
float:left;
}

.menu
{
width:159px;
margin–bottom:10px;
}

.menu .centre
{

margin:0px;
border:none;

background:url('menu/menu_centre.png') repeat–y;

padding–left:14px;
padding–right:12px;

color:#ffffff;
font–family:Rockwell‚ Arial‚ Verdana‚ serif;
}

.menu .haut
{

padding–top:12px;
padding–left:22px;

margin:0px;
border:none;

height:25px;
background:url('menu/menu_haut.png') no–repeat;

color:#ffb991;
font–weight:bold;
text–decoration:underline;
font–family:Rockwell‚ Arial‚ Verdana‚ serif;
}

.menu .bas
{
margin:0px;
border:none;

height:2px;
background:url('menu/menu_bas.png') no–repeat;
}

.menu a
{
text–decoration:none;
color:#ffffff;
}

.menu a:hover
{
text–decoration:underline overline;
color:#ffc74f;
}

/*CORPS*/
#corps
{
width:80%;
margin:0px;
margin–left:200px;
}

#corps .haut_gauche
{
background:url('corps/corps_haut_gauche.png') no–repeat bottom left;
padding–left:13px;
}
#corps .haut_droite
{
background : url("corps/corps_haut_droite.png") bottom right no–repeat ;
padding–right:27px ;
}
#corps .haut_centre
{
background : url("corps/corps_haut_centre.png") bottom center repeat–x ;
width : 100% ;
padding–top :27px ;
}

#corps .centre_gauche
{
background : url("corps/corps_centre_gauche.png") left repeat–y ;
padding–left: 13px ;
height : 100% ; /* Pour que toute la place disponible soit utilisée (sinon il y a des bugs si on met un <h1> à l'intérieur par exemple)‚ allez pas me demander pourquoi */
}

#corps .centre_droite
{
background : url("corps/corps_centre_droite.png") right repeat–y ;
padding–right: 27px ;
height : 100% ;
}

#corps .centre_centre
{
background :url("corps/corps_centre.png");
width : 100% ;
height : 100% ;
}

#corps .bas_gauche
{
background : url("corps/corps_bas_gauche.png") top left no–repeat ;
padding–left: 13px ;
}

#corps .bas_droite
{
background : url("corps/corps_bas_droite.png") top right no–repeat ;
padding–right: 27px ;
}

#corps .bas_centre
{
background : url("corps/corps_bas_centre.png") top center repeat–x ;
width : 100% ;
padding–top : 15px ;
}

Voilà

socomajor

5 mars 2006 à 16:39:27

Bonjour ! Je suis en train de refaire mon site et il y a un problème :

Avec Firefox mon site s'ouvre tout nikel, avec IE le corps ce met en dessous du menu, comme si float:left; n'avait pas fonctionné sur le menu...

Ici pour voir le problème

Merci d'avance !

Anonyme

5 mars 2006 à 17:20:25

T'as un problème de margin-left et de width .
Montre ton code .