Bonjour,

Voici comment j'aimerais que ma page soit organisée :
— une en-tête en haut, dont je ne donne pas la hauteur (elle prend donc celle du texte) et 100% de largeur, elle est placée tout au dessus.
— un bas-de-page, même caractéristiques, mais évidemment aligné en-dessous.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
.haut {
width:100%;
left:0%;
top:0%;
overflow: auto;
}
 
.bas {
width:100%;
position:absolute;
bottom:0%;
left:0%;
overflow: auto;
}
— Entre les deux, je voudrais placer deux bloc, dont celui de droite contient le contenu (à savoir qu'il ne va pas jusqu'à l'extrémité droite de la page) et celui de gauche le menu. Quelque soit le contenu, je ne veux pas qu'une barre de défilement apparaisse sur toute la page, mais que cette barre de défilement apparaisse uniquement pour le bloc qui n'a pas assez de place. J'ai remarqué que en plaçant tous ces blocs (les 4) dans un 5e global, cela fonctionnait.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
.all {
width:94%;
height:94%;
position:absolute;
left:0%;
top:0%;
margin: 3% 3% 3% 3%;
overflow: auto;
}
 
.menu {
width:40%;
height:73%;
position:relative;
float:left;
overflow: auto;
margin-top:20px;
margin-bottom:20px;
}
 
.contenu {
width:50%;
height:73%;
position:relative;
float:left;
overflow: auto;
padding-right:20px;
margin-top:20px;
margin-bottom:20px;
margin-left:20px;
}
Bon, tout va bien. Sauf que à la place du « 73 % », j'aimerais que le bloc « menu » et le bloc « contenu » prennent toute la place disponible laissée par les deux autres blocs. Comment puis-je faire cela ?

Merci pour votre aide,
Yamaw.