Bonjour,
J'ai suivi le superbe tuto que vous nous avez offert pour créer un site à deux colonnes.
Le rendu me plait.... mais sous Firefox... sous IE6, tout fout le camp!
Je cherche depuis quelques jours comment faire.... j'arrive avec quelques mixes à afficher ce que je veux sur l'un des navigateurs, c'est toujours en sacrifiant le second!
Est-ce que quelqu'un pourrait me filer un coup de main:
Le site est www.babooz.org , sous spip, mais c'est sans conséquence:
Le code html est:
avec pour habillage:
Et pour IE:
J'espère ne pas abuser en copiant mon code, mais au moins, ca vous évitera d'aller chercher sur place.
Merci d'avance à tous ceux qui tenteront de me faire part de leurs commentaires...
PS: tiens, une page sur des Aslsaciens...
Modifié par straydogg (16 Jan 2007 - 22:57)
J'ai suivi le superbe tuto que vous nous avez offert pour créer un site à deux colonnes.
Le rendu me plait.... mais sous Firefox... sous IE6, tout fout le camp!
Je cherche depuis quelques jours comment faire.... j'arrive avec quelques mixes à afficher ce que je veux sur l'un des navigateurs, c'est toujours en sacrifiant le second!
Est-ce que quelqu'un pourrait me filer un coup de main:
Le site est www.babooz.org , sous spip, mais c'est sans conséquence:
Le code html est:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" lang="fr">
<head>
<title>Babooz.org</title>
<link rel="stylesheet" href="squelettes/habillage.css" type="text/css" media="projection, screen, tv" />
<!--[if lt IE 6]>
<link rel="stylesheet" href="squelettes/ie.css" type="text/css" media="projection, screen, tv" />
<![endif]-->
</head>
<body>
<div id="global">
<div id="header">
Tarratata
</div><!-- fin header -->
<div id="center">
<div id="sidebar">
<h1>Navigation</h1>
<div class="rubriques">
Les rubriques du site
</div>
</div><!-- fin sidebar -->
<div id="content">
<div id="conteneur">
<div id="contenu">
<div class="cartouche">
<div class="chapo">Amuse gueule musical, performances sur scènes depuis L’Alsace !</div>
</div>
<div class="texte">
le texte
</div>
</div>
</div><!-- fin content -->
</div><!-- fin center -->
<div id="footer">
footer
</div><!-- fin footer -->
</div><!-- fin global -->
</body>
</html>
avec pour habillage:
html, body {
margin: 0;
padding: 0;
height: 100%;
}
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size : 11px;
color : #000;
background-color : #F3F2D5;
}
div#global {
min-height:100%;
width: 750px;
padding: 0 10px;
margin: 0 auto;
position:relative;
}
div#center {
padding-bottom:100px;
overflow: auto;
background-image : url(images/centre.jpg);
}
div#header {
height : 248px ;
background-color :transparent;
background-image : url(images/haut.jpg);
}
div#footer {
position: absolute;
width : 680px ;
bottom: 0;
height : 98px ;
background-image : url(images/bas2.jpg);
margin-left : auto;
margin-right : auto;
padding: 0 35px;
text-align:center;
}
div#footer p {
margin-top:50px;
color:#4B8133;
}
div#content {
float: right;
width:490px;
margin-right: 40px;
text-align:justify;
}
div#sidebar {
float: left;
width: 150px;
padding: 0 35px;
}
Et pour IE:
#global {
height: 100%;
}
#content {
display:inline;}
#center {
overflow: visible;
height: 1%;
}
#content, #sidebar {
margin-top: 15px;
}
#global {
position: static;
}
a, pre {
position:relative;}
body {
position: relative;
}
J'espère ne pas abuser en copiant mon code, mais au moins, ca vous évitera d'aller chercher sur place.
Merci d'avance à tous ceux qui tenteront de me faire part de leurs commentaires...
PS: tiens, une page sur des Aslsaciens...
Modifié par straydogg (16 Jan 2007 - 22:57)
