Probleme affichage xhtml/css avec IE !

Fermé
pampa77 - 13 mars 2009 à 10:03
davdes Messages postés 56 Date d'inscription vendredi 12 octobre 2007 Statut Membre Dernière intervention 31 mai 2012 - 14 mars 2009 à 17:50
Bonjour,

voila j'ai besoin d'aide ! J'ai un problème d'affichage sur ma page web.
J'ai créé mon site sous FF donc pas de problème avec celui la.

Mais sous IE, je n'arrive pas. Le problème est qu'il me saute des ligne entre certaine div.
Ca me fais donc des trou entre mes bloc.

Mon menu du milieu est également pas mal décalé ! Je n'arrive pas a trouver pourquoi.
J'ai pas mal cherché sur le net mais je ne trouve pas de réponse.

Je m'en remets donc a vos connaissances et a votre gentillesse.

Voici mon site en question:

http://www.gagner-argent-gratuitement.com/

Et voici mon code HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Bienvenue sur mon site !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style_test.css" rel="stylesheet" type="text/css" media="screen" />
</head>


<body>

<!-- logo -->
<div id="en_tete">
<a href="https://www.google.fr/?gws_rd=ssl"></a>
</div><!-- Ici on mettra l'en tete -->



<!-- menu gauche haut -->


<div id="conteneur_gauche"> <!-- Cadre englobant tous les sous-menus (en bleu marine sur le schéma) -->
<div id="menu_gauche">
<ul>
<li>
<a href="https://www.google.fr/?gws_rd=ssl">MENU</a>
</li> <!-- Liste des liens du sous-menu -->
</ul>
</div>

<div id="contenu_gauche">
<ol>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien1</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien2</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien3</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien4</a></li>
</ol>

<ul>
<li><a href="https://www.google.fr/?gws_rd=ssl">MENU</a>
</li> <!-- Liste des liens du sous-menu -->
</ul>


<div id="contenu_gauche_bottom">
<ol>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien1</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien2</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien3</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">lien4</a></li>
</ol>
</div>
</div>


<div id="contenu_gauche_bottom_bas"></div>
</div>

<!-- menu milieu -->


<div id="conteneur_milieu">
<div id="menu_milieu">
<ul>
<li><a href="https://www.google.fr/?gws_rd=ssl" class="index">Index</a></li> <!-- menu Index -->
<li><a href="https://www.google.fr/?gws_rd=ssl" class="argent">Gagner de l'argent</a></li> <!-- menu argent -->
<li><a href="https://www.google.fr/?gws_rd=ssl" class="filleuls">Gagner des filleuls</a></li> <!-- menu gagner des filleuls -->
<li><a href="https://www.google.fr/?gws_rd=ssl" class="forum">Forum</a></li> <!-- menu forum -->
<li><a href="https://www.google.fr/?gws_rd=ssl" class="contact">Contact</a></li> <!-- menu contact -->
</ul>
<div class="clear"></div>
</div>
</div>

<!-- corps haut -->

<div id="global_corps">
<div id="corps_haut"></div><!-- Ici on mettra le contenu principal de la page (tout le texte quoi) -->

<div id="corps_milieu"> <span class="titre">Mon super site</span><br clear="all"/> <!-- 1er titre -->
Les visiteurs de l'hypermarché Carrefour de Haidian, un quartier nord de Pékin où sont installées les universités et les entreprises high-tech, ne sont pas accueillis en ce moment par le Père Noël mais par... la Vénus de Milo. Carrefour a décidé de donner dans le culturel en présentant, dans le cadre de l'année de la France en Chine, quarante reproductions de sculptures célèbres issues de collections des musées français. L'initiative remporte un grand succès, à en croire le nombre de personnes qui se prennent en photo devant les oeuvres, ou l'affluence aux visites <a href="www.yahoo.fr">commentées</a> par des guides. <!-- paragraphe avec lettrine -->
<span class="titre">Unobux</span> <!-- 2eme titre -->

<div>Bienvenue sur mon super site !

Vous allez adorer ici, c'est un site génial qui va parler de... heu... Je cherche encore un peu le thème de mon site :-D

A qui s'adresse ce site ?

<div> A tout le monde ! Si je commence à privilégier certaines personnes, on va m'accuser de discrimination ;o)
Que vous soyez fans de fusils à pulsion plasma ou de Barbie et Ken, ce site est fait pour vous ! Si si !
</div>
<div>
L'auteur du site ? Bah, c'est moi, quelle question :-p
Je vais essayer de faire le meilleur site du monde (ça doit pas être bien compliqué). Mon objectif est d'attirer un maximum de visiteurs, de les rendre accros à mon site, puis de les mettre en mon pouvoir.<br />
Je prendrai ensuite le contrôle du Monde. Une fois que ce sera fait, j'irai explorer les confins de l'Univers à la recherche de nouveaux peuples à soumettre à ma terrible puissance. MooUUuUuuUAhahHaaAhAAaaah !!! (rire diabolique).
</div>
</div>
</div>
</div>

<!-- menu droite -->

<div id="conteneur_droite">
<div id="menu_droite">
<ol>
<li>
<a href="https://www.google.fr/?gws_rd=ssl">NEWS</a>
</li> <!-- Liste des liens du sous-menu -->
</ol>
<div class="clear"></div>
<div id="contenu_droite">
<ul>
<li><a href="https://www.google.fr/?gws_rd=ssl">Mise à jours de la liste des SCAM.</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">Mise à jours de la liste des SCAM.</a></li>
<li><a href="https://www.google.fr/?gws_rd=ssl">Mise à jours de la liste des SCAM.</a></li>
</ul>
</div>
<div id="contenu_droite_bas"></div>
</div>

</div>


<!-- corps bas -->

<div id="corps_bas">
<div class="clear"></div>
<div id="bas">Copyright © 2009 - <a href="google"></a> All Right Reserved</div>
</div>

</body>
</html>







et mon code CSS:


body {
width : 1024px;
margin : auto;
background : #dee2e3 url(theme/fond-bg.jpg) no-repeat top center;
font-family : Helvetica, Arial, sans-serif;
font-size : 12px;
}
a {
text-decoration : none;
font-weight : bold;
color : #000000;
}
a:hover {
color : #fe7f00;
}
.clear {
clear : both;
}

/*pour FF*/
#en_tete {
width : 455px;
height : 131px;
background-image : url(theme/new-logo.png);
margin-top : 20px;
margin-left : 30px;
margin-bottom : 20px;
}
#conteneur_gauche {
float : left;
width : 153px;
margin-right : 20px;
margin-top : 30px;
}
#menu_gauche {
background : url(theme/menu-g-h.png) no-repeat bottom left;
height : 55px;
width : 151px;
}
#menu_gauche ul li {
list-style : none;
float : left;
width : 151px;
}
#menu_gauche ul li a {
height : 36px;
width : 122px;
font-size : 14px;
text-decoration : none;
text-align : center;
display : block;
background : url(theme/actualite.png) no-repeat top left;
line-height : 36px;
color : #000000;
margin : 18px 0 -16px -25px;
}
#menu_gauche ul li a:hover {
background-position : bottom left;
}
#contenu_gauche {
background : url(theme/menu-gauche-milieu.png) repeat-y left bottom;
margin-top : 17px;
}
#contenu_gauche ol li {
list-style : none;
}
#contenu_gauche ol li a {
font-size : 14px;
text-decoration : none;
text-align : center;
line-height : 14px;
color : #000000;
padding-left:20px;
}
#contenu_gauche {
background : url(theme/menu-gauche-milieu.png) repeat-y left bottom;
margin-top : -12px;
}
#contenu_gauche ul li {
list-style : none;
}
#contenu_gauche ul li a {
width : 122px;
font-size : 14px;
text-decoration : none;
text-align : center;
display : block;
background : url(theme/actualite.png) no-repeat top left;
line-height : 36px;
color : #000000;
margin-left:-25px;
}
#contenu_gauche ul li a:hover {
background-position : bottom left;
}
#contenu_gauche_bottom ol li {
list-style : none;
}
#contenu_gauche_bottom ol li a {
font-size : 14px;
text-decoration : none;
text-align : center;
line-height : 14px;
color : #000000;
padding-left :20px;
}
#contenu_gauche_bottom_bas {
background : url(theme/menu-g-b.png) no-repeat left bottom;
height : 26px;
width : 146px;
margin-top :-12px;
margin-left:2px;
}
#conteneur_milieu {
width : 726px;
margin : auto;
}
#menu_milieu {
background : url(theme/bande-h.png) no-repeat bottom left;
height : 81px;
width : 726px;
margin-top : -14px;
margin-left:3px;
}
#menu_milieu ul li {
list-style : none;
float : left;
}
#menu_milieu ul li a {
height : 44px;
font-size : 12px;
text-decoration : none;
text-align : center;
display : block;
background : no-repeat top left;
line-height : 44px;
color : #000000;
}
#menu_milieu ul li a:hover {
background-position : bottom left;
line-height : 44px;
}
#menu_milieu ul li a.index {
background-image : url(theme/btn-index.png);
width : 98px;
margin-left :-35px;
}
#menu_milieu ul li a.argent {
background-image : url(theme/btn-argent.png);
width : 198px;
}
#menu_milieu ul li a.filleuls {
background-image : url(theme/btn-filleuls.png);
width : 202px;
}
#menu_milieu ul li a.forum {
background-image : url(theme/btn-forum.png);
width : 107px;
}
#menu_milieu ul li a.contact {
background-image : url(theme/btn-contact.png);
width : 95px;
}
#global_corps {
width : 746px;
margin : auto;
float : left;
}
#corps_haut {
background : url(theme/milieu-h.png) no-repeat left;
background-position : bottom left;
height : 34px;
width : 746px;
margin-top : -10px;
margin-left : -35px;
}
#corps_milieu {
background : url(theme/milieu-m.png) repeat-y left;
margin-left : -39px;
padding-right :80px;
padding-left: 35px;
}
#corps_milieu .titre {
background : url(theme/cadre-interieur-titre.png) no-repeat top left;
font-size : 15px;
display : block;
width : 740px;
height : 31px;
line-height : 31px;
font-weight : bold;
padding-bottom :10px;
padding-left: 10px;
margin-top : 10px;
margin-bottom : 10px;
float : left;
}
#corps_milieu div:first-letter {
float : left;
font-size : 2.5em;
font-family : Arial, Georgia, "Times New Roman", Times, serif;
font-weight : bold;
margin-top : 7px;
margin-right: 2px;
width : 740px;
}
#conteneur_droite {
float : left;
width : 151px;
margin-left : 860px;
margin-right : 10px;
margin-top : -406px;
}
#menu_droite {
background : url(theme/menu-g-h.png) no-repeat bottom left;
height : 54px;
width : 151px;
}
#menu_droite ol li {
list-style : none;
float : left;
width : 151px;
}
#menu_droite ol li a {
height : 36px;
width : 122px;
font-size : 14px;
text-decoration : none;
text-align : center;
display : block;
background : url(theme/actualite.png) no-repeat top left;
line-height : 36px;
color : #000000;
margin : 18px 0 -16px -25px;
}
#menu_droite ol li a:hover {
background-position : bottom left;
}
#contenu_droite {
background : url(theme/menu-gauche-milieu.png) repeat-y left bottom;
}
#contenu_droite ul li {
list-style : none;
}
#contenu_droite ul li a {
font-size : 10px;
text-decoration : none;
text-align : center;
line-height : 10px;
}
#contenu_droite_bas {
background : url(theme/menu-g-b.png) no-repeat left bottom;
height : 26px;
width : 146px;
margin : -16px 0 0 2px;
}
#corps_bas {
background : url(theme/milieu-b.png) no-repeat;
width : 746px;
height : 54px;
margin : 0 0 0 134px;
padding : 22px 0 0 0;
font-size : 12px;
text-align : center;
line-height : 12px;
float : left;
}


Merci infiniment d'avance !

pampa

2 réponses

personne ? :(
0
davdes Messages postés 56 Date d'inscription vendredi 12 octobre 2007 Statut Membre Dernière intervention 31 mai 2012 3
14 mars 2009 à 17:50
Bonjour,

ces deux sites proposent des solutions qui fonctionnent.
Cordialement.

http://ethtezahl.over-blog.com/article-25217445.html

http://www.lyxia.org/...
0