tout les bloc centaux de mon design se retrouve en bas de la page sous ie alors que dans les autres navigateurs tout baigne y'a t'il une solution???
mon design (html et css ) :
http://fxdarkplayer.free.fr/design/
HTML :
CSS:
Modifié par fxldm (21 Sep 2005 - 00:01)
mon design (html et css ) :
http://fxdarkplayer.free.fr/design/
HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" >
<link rel="StyleSheet" type="text/css" href="style.css" >
<title></title>
</head>
<body>
<div id="header">
</div>
<div id="menuhaut">
<a href="#" class="horizon1"></a>
<a href="#" class="horizon2"></a>
<a href="#" class="horizon3"></a>
<a href="#" class="horizon4"></a>
<a href="#" class="horizon5"></a>
<a href="#" class="horizon6"></a>
<a href="#" class="horizon7"></a>
<a href="#" class="horizon8"></a>
<a href="#" class="horizon9"></a>
<a href="#" class="horizon10"></a>
<a href="#" class="horizon11"></a>
</div>
<div id="contenu">
<div id="menugauche">
<img src="http://lewebzine.celeonet.fr/universal/images/recherche.gif" width="65" height="9" alt="" vspace="5"><br />
<input type="text" name="a" size="11" maxlength="50">
<br />
<a href="javascript:opensearch()" onMouseOver="Rollover('13','on');" onMouseOut="Rollover('13','off');"><img src="http://lewebzine.celeonet.fr/universal/images/nav13.gif" width="94" height="7" alt="Recherche avancée" vspace="5" name="nav13"></a><br />
<a href="#" class="nav1" ></a>
<a href="#" class="nav2" ></a>
<a href="#" class="nav3" ></a>
<a href="#" class="nav4" ></a>
<a href="#" class="nav5" ></a>
<a href="#" class="nav6" ></a>
<a href="#" class="nav7" ></a>
</div>
<div id="blocs">
<div id="bloc1"><h2>bloc 1</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc bibendum. Vestibulum scelerisque,
wisi ac ultricies luctus, lectus augue posuere dui, a sollicitudin nunc ante ut tortor. Quisque
tincidunt porttitor nisl. Sed ipsum. Donec vitae ante. SuspendRollovere lacus augue, venenatis vel,
posuere vitae, hendrerit et, erat. Pellentesque luctus. Aenean nibh. Proin ut wisi et metus
imperdiet porttitor. SuspendRollovere ipsum.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc bibendum. Vestibulum scelerisque,</p>
</div>
<div class="blocss">
<div id="bloc2"><h2>bloc 2</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc bibendum. Vestibulum scelerisque,
wisi ac ultricies luctus, lectus augue posuere dui, a sollicitudin nunc ante ut tortor. Quisque
tincidunt porttitor nisl. Sed ipsum. Donec vitae ante. SuspendRollovere lacus augue, venenatis vel,
posuere vitae, hendrerit et, erat. Pellentesque luctus. Aenean nibh. Proin ut wisi et metus
imperdiet porttitor. SuspendRollovere ipsum.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc bibendum. Vestibulum scelerisque,</p>
<br /><br /><hr size="1" color="#000000"><br /><br />
<p>wisi ac ultricies luctus, lectus augue posuere dui, a sollicitudin nunc ante ut tortor. Quisque
tincidunt porttitor nisl. Sed ipsum. Donec vitae ante. SuspendRollovere lacus augue, venenatis vel,
posuere vitae, hendrerit et, erat. Pellentesque luctus. Aenean nibh. Proin ut wisi et metus
imperdiet porttitor. SuspendRollovere ipsum.</p>
</p>
</div>
<div id="bloc3"><h2>bloc 3</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc bibendum. Vestibulum scelerisque,
wisi ac ultricies luctus, lectus augue posuere dui, a sollicitudin nunc ante ut tortor. Quisque
augue, vene</p>
</div>
<div id="bloc4"><h2>bloc4</h2>
<p>Complètement zinzins !</p>
</div>
</div>
<div class="blocss">
<div id="bloc5"><h2>bloc 5</h2>
<p>Shoutbox</p>
</div>
<div id="bloc6"><h2>bloc 6</h2>
<p>Derniers messages</p>
</div>
</div>
</div>
</div>
<div id="bas">
<center><p>
<a href="#" onclick='window.open("boite_id.html","boite","width=617,height=580,menubar=0,scrollbars=1,resizable=0,toolbar=0");'>Boite a idées</a>
<a href="#" onclick='window.open("thanks.html","Thanks","width=617,height=580,menubar=0,scrollbars=1,resizable=0,toolbar=0");'>Remerciement</a>
<a href="#" onclick='window.open("rules.html","rules","width=617,height=580,menubar=0,scrollbars=1,resizable=0,toolbar=0");'>Condition d'usage</a></p></center>
</div>
</body>
</html>CSS:
p {
font-family : Arial, helvetica;
font-size : 11px;
color : #666666;
line-height : 18px;
}
#header {
width : 779px;
height : 124px;
background : url(images/header.jpg) no-repeat;
}
#menuhaut {
width : 781px;
}
#contenu {
width : 781px;
}
#menugauche {
float : left;
border : 1px solid #999999;
border-right : 0;
border-left : 0;
width : 179px;
}
#blocs {
width : 602px;
margin-top : 29px;
margin-left : 179px;
}
#bloc1 {
background-color : #ffffd2;
border : 1px solid #999999;
padding-left : 10px;
padding-right : 20px;
padding-top : 40px;
width : 569px;
}
.blocss {
width : 603px;
padding : 0;
border : 0;
}
#bloc2 {
background-color : #ffd9d9;
border : 1px solid #999999;
border-right : 0;
border-top : 0;
float : left;
height : 611px;
padding-left : 10px;
width : 40%;
}
#bloc3 {
background-color : #d7ffdd;
border : 1px solid #999999;
border-top : 0;
height : 335px;
width : 56%;
padding-left : 10px;
float : left;
}
#bloc4 {
background-color : #ffffaf;
border : 1px solid #999999;
border-top : 0;
float : left;
height : 275px;
padding-left : 10px;
width : 56%;
}
#bloc5 {
background-color : #b0b3ff;
border : 1px solid #999999;
border-top : 0;
border-right : 0;
float : left;
height : 365px;
padding-left : 10px;
width : 53%;
}
#bloc6 {
background-color : #d2ffd8;
border : 1px solid #999999;
border-top : 0;
float : left;
height : 365px;
padding-left : 10px;
width : 43%;
}
#bas {
background-image : url(images/footer2.jpg);
float : left;
height : 33px;
width : 779px;
border-right : 1px solid #999999;
border-left : 1px solid #999999;
}
[...](la suite c'est des rolls over)
Modifié par fxldm (21 Sep 2005 - 00:01)
. je vais essayé de corrrigé les avertisement et d'optimisé mon code 
)
je viens de remarqué ke le footer c'est decalé vers le bas c'est normal???)
) mais on avisera ensuite (si tu choisis cette façon de faire). L'objectif étant de démontrer que l'on peut contourner proprement ce bug d'IE. Un désavantage du positionnement absolu est de rendre rigide le design, mais dans ton cas, tu as déjà donné des hauteurs fixes alors ça ne change pas grand chose.
