Bonjour,
Après avoir attentivement recherché une série d'informations qui m'a d'ailleurs été très utile pour mon site, je me suis retrouvé un peu perdu à ne plus savoir quoi utiliser comme balise.
Mes problèmes sont les suivants: J'ai essayé de faire un site avec un height de 100% en imbriquant plusieurs conteneurs l'un dans l'autre. Le dernier contenant mon texte utilise un overflow-y qui fonctionne que sur Internet Explorer, mais pas sur Firefox. J'ai essayé le overflow:hidden, mais ça ne donne rien. Ca fonctionne uniquement si je détermine une hauteur fixe (ce que je ne souhaite pas faire)
D'autre part, un utilisant un padding sur cette même <div>, la scrollbar vertical se retrouve à l'extérieur sur IE (alors que sur Mozilla, quand ça fonctionne, il me l'affiche correctement)
Un apreçu du problème est disponible à l'adresse suivante: http://www.lahode.ch/demo/demo.html
Voici mon code CSS:
/* Paramètres généraux */
Merci d'avance pour vos conseils, ça fait à présent deux mois que je rame dessus sans trouver la réponse
Modifié par astrobob (19 Nov 2006 - 18:58)
Après avoir attentivement recherché une série d'informations qui m'a d'ailleurs été très utile pour mon site, je me suis retrouvé un peu perdu à ne plus savoir quoi utiliser comme balise.
Mes problèmes sont les suivants: J'ai essayé de faire un site avec un height de 100% en imbriquant plusieurs conteneurs l'un dans l'autre. Le dernier contenant mon texte utilise un overflow-y qui fonctionne que sur Internet Explorer, mais pas sur Firefox. J'ai essayé le overflow:hidden, mais ça ne donne rien. Ca fonctionne uniquement si je détermine une hauteur fixe (ce que je ne souhaite pas faire)
D'autre part, un utilisant un padding sur cette même <div>, la scrollbar vertical se retrouve à l'extérieur sur IE (alors que sur Mozilla, quand ça fonctionne, il me l'affiche correctement)
Un apreçu du problème est disponible à l'adresse suivante: http://www.lahode.ch/demo/demo.html
Voici mon code CSS:
/* Paramètres généraux */
html {
margin: 0;
padding: 0;
text-align: center; /* pour corriger le bug de centrage IE */
height: 100%;
overflow: hidden;
}
body {
margin: 0;
padding: 0;
text-align: center; /* pour corriger le bug de centrage IE */
height: 100%
}
/* Conteneur principal */
#container {
position:relative;
margin-left: auto;
margin-right: auto;
text-align: left; /* on rétablit l'alignement normal du texte */
width: 760px;
height: auto !important;
height: 100%;
min-height: 100%;
}
/* Conteneur de ma balise au top */
#mainmenu {
position:relative;
display: block;
margin-right: 10px; /* placement du logo dans son conteneur, head1 */
margin-top: 3px;
width: 760px;
height: 95px;
border: 0px;
line-height: 60px;
text-indent: 40px;
top:0px;
left:0px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='mainmenu.png', sizingMethod='scale');
}
#mainmenu[ id] {
background: url('mainmenu.png');
}
/* Conteneur secondaire */
#mainbody {
position:relative;
display: block;
float: left;
width: 758px;
top:0px;
height: auto !important;
height: 85%;
min-height: 85%;
margin-bottom: auto;
border:1px;
border-color:#555555;
border-style:solid;
}
/* Image en arrière-plan du conteneur secondaire (étirable) */
#backgroundImage {
position: absolute;
width : 100%;
height: 100%;
}
/* Titre de ma page (Destinations) */
#maintitlebar {
position:relative;
height: 30px;
width: 758px;
line-height:30px;
text-indent:50px;
background-color:#000000;
color:#FFFFFF;
}
/* Conteneur de texte */
#maintext {
position:relative;
overflow-y: auto;
height: auto !important;
height: 90%;
min-height: 90%;
padding:15px;
}
Merci d'avance pour vos conseils, ça fait à présent deux mois que je rame dessus sans trouver la réponse
Modifié par astrobob (19 Nov 2006 - 18:58)
.