Bonjour ou plutôt bonsoir à tous,
Voilà, je suis actuellement entrain de transformer un stie codé à l'ancienne pour le passer en html / css dont voici l'adresse actuelle : siontourism.
Donc j'avance sur la première page je fais ma structure qui se présente comme suit:
- site centré avec un header
- ensuite un float left qui contient ma navigation (sidebar)
- à droite du bloc flotté le contenu du site
- au fond un footer mis en clear (pas fini de développer)
Le problème est que IE m'affiche un espace d'environ 3 pixel entre mon menu en float et mon bloc contenu et impossible de m'en débarasser. Sous firefox par contre c ok.
Avec IE:
Avec Firefox:
Je joins aussi mon code source pour plus de clarté
HTML
CSS (échantillon)
Si vous aviez un début de piste ou un moyen de contournement à mon problème ca me ferait plaisir car ca fait un petit moment que je tourne en rond là.
Merci et bonne soirée à tout le monde
Modifié par Daweed (04 Nov 2005 - 21:17)
Voilà, je suis actuellement entrain de transformer un stie codé à l'ancienne pour le passer en html / css dont voici l'adresse actuelle : siontourism.
Donc j'avance sur la première page je fais ma structure qui se présente comme suit:
- site centré avec un header
- ensuite un float left qui contient ma navigation (sidebar)
- à droite du bloc flotté le contenu du site
- au fond un footer mis en clear (pas fini de développer)
Le problème est que IE m'affiche un espace d'environ 3 pixel entre mon menu en float et mon bloc contenu et impossible de m'en débarasser. Sous firefox par contre c ok.
Avec IE:
Avec Firefox:
Je joins aussi mon code source pour plus de clarté
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
.
.
.
<body>
<div id="wrapper">
<div id="header">
<?=$bannerBody?>
</div>
<div id="content">
<div id="sidebar">
<div id="sidebar_content">
<?=$menuBody?>
</div>
</div>
<div id="main">
<h1><?=$pagetit?></h1>
<p>test</p>
</div>
</div>
</div>
</body>
.
.
.
CSS (échantillon)
html, body {
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
text-align: center;
background-color: #FFF;
color: #000;
margin: 0;
}
#wrapper {
width: 774px;
text-align: left;
margin: 0 auto;
}
#header {
background-image: url(img/banner.png);
height: 95px;
}
#content {
width: 774px;
}
#sidebar {
float: left;
width: 223px;
background: url(img/bg_menu.gif) red 22px 0 no-repeat;
}
#sidebar_content {
padding: 55px 0 0 20px;
}
#main {
margin: 0 0 0 220px;
}
/* menu au sommet de la page dans le header */
ul#navmenu {
float: right;
list-style-type: none;
margin: 5px 0 0 0;
padding: 0;
}
ul#navmenu li {
font-size: .7em;
float: left;
margin: 0 20px 0 20px;
}
ul#navmenu li a {
color: #fff;
font-weight: bold;
text-decoration: none;
}
ul#navmenu li a:hover {
text-decoration: underline;
}
/* menus de la sidebar */
#sidebar ul {
background-color: #ECECEC;
list-style-type: none;
margin: 0;
padding: 0;
}
#sidebar ul li {
font-size: .8em;
background: url(img/puce_sidebar.png) no-repeat 5px 6px;
padding: 0 0 0 20px;
line-height: 160%;
}
#sidebar ul li a {
color: #000;
}
#sidebar ul li a:hover {
text-decoration: underline;
}
/* définition des balises générales */
a, a:link, a:visited, a:active {
text-decoration: none;
}
h1 {
font-size: .9em;
background: url(img/exterieurb.gif) no-repeat top right;
margin: 0;
padding: 0;
height: 30px;
width: 540px;
line-height: 200%;
text-align: left;
background-color: #08115E;
color: #fff;
}
Si vous aviez un début de piste ou un moyen de contournement à mon problème ca me ferait plaisir car ca fait un petit moment que je tourne en rond là.
Merci et bonne soirée à tout le monde
Modifié par Daweed (04 Nov 2005 - 21:17)
. Il me semblait bien qu'il s'agissait d'un bug IE. Je vais aller voir les ressources que vous m'avez fournies et essayer de compensser ce bug pas si terrible que ca mais bien embêtant quand même 
.