WRInaute accro
Bonjour,
Je seiche sur un problème a la con de hauteur d'une div.
J'ai une page, qui comprend (entre autre) deux blocs (div) qui doivent respectivement avoie une hauteur de 50% du total de la surface affichable du navigateur.
Ces deux div sont positionnées par CSS l'une au dessus de l'autre.
En toute logique si elle font 50 % de la hauteur totale et et positionnées l'une au dessus de l'autre, cela doit me donner une occupation totale de l'écran et ces deux blocs doivent coller l'un a l'autre.
exemple en image :
Sous IE, les propriétés height 50% ne semblent pas interprétées voir :
Une idée ?
La page est ici : http://www.sculpture-et-pierre.fr/Ombre.php
le Html pour ces deux blocs est comme ceci :
et le CSS associé :
Merci
Je seiche sur un problème a la con de hauteur d'une div.
J'ai une page, qui comprend (entre autre) deux blocs (div) qui doivent respectivement avoie une hauteur de 50% du total de la surface affichable du navigateur.
Ces deux div sont positionnées par CSS l'une au dessus de l'autre.
En toute logique si elle font 50 % de la hauteur totale et et positionnées l'une au dessus de l'autre, cela doit me donner une occupation totale de l'écran et ces deux blocs doivent coller l'un a l'autre.
exemple en image :
Sous IE, les propriétés height 50% ne semblent pas interprétées voir :
Une idée ?
La page est ici : http://www.sculpture-et-pierre.fr/Ombre.php
le Html pour ces deux blocs est comme ceci :
Code:
<div class="B1">
<div class="content">
<!-- contenu textuel de la page -->
<h1>Ombre</h1>
<br/>
L'ombre est un mystère vivant. <br/><br/>
Vivant parce que seuls les morts n'ont plus d'ombre, <br/>
mystère parce que cet étrange double de nous-mêmes
s'attache à nos pas et nous échappe en même temps.<br/><br/>
Catherine d'Humières
<!-- fin du contenu textuel de la page -->
</div>
</div>
<div class="B3">
<div class="menu">
<a href="http://www.sculpture-et-pierre.fr/" title="Sculpture et pierre">accueil</a><br/><br/>
<a href="http://www.sculpture-et-pierre.fr/Artiste.php" title="">l'artiste</a><br/>
(...)
<a href="http://www.sculpture-et-pierre.fr/Lumiere.php" title="lumière">la lumière</a><br/>
<a href="http://www.sculpture-et-pierre.fr/Contraste.php" title="">le contraste</a><br/>
</div>
</div>et le CSS associé :
Code:
/*******************************************************************************
block de contenu general
*******************************************************************************/
.B1{
position: absolute;
top: 0px;
left: 0px;
width: 250px;
height: 50%;
color: #ffffff;
background-color: #000000;
border-right: 1px solid #898a89;
filter: alpha(opacity=50);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
opacity:0.50;
}
/* sous bloc de contenu (inclus dans le B1) */
.content{
width: 220px;
height: 80%;
position: relative;
left: 10px;
top: 10px;
}
/*******************************************************************************
bloc de menu principal (menu)
*******************************************************************************/
.B3{
position: absolute;
top: 50%;
left: 0px;
width: 250px;
height: 50%;
color: #0000ff;
background-color: #ffffff;
border-right: 1px solid #898a89;
filter: alpha(opacity=50);
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
opacity:0.50;
}
/* sous bloc de menu */
.menu{
width: 220px;
height: 80%;
position: relative;
left: 10px;
top: 10px;
}Merci
