Discussion :

[Allegro]

Bonjour,
J'ai un site dont la structure est relativement simple : une bannière, un menu vertical à gauche et le contenu à droite :
| bannière |
|menu|contenu|

Le code CSS associé à ces trois éléments est le suivant :

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
#banniere {
	width:1249px;
	height:82px;
	background-color:#A085B0;
	text-align:center;
	border-left:1px solid black;
	border-top:1px solid black;
	border-right:1px solid black;
	}
#menu {
	float:left;
	width:160px;
	height:690px;
	background-color:#A085B0;
	padding:0px;
	margin:0px;
	border-left:1px solid black;
	border-bottom:1px solid black;
	}
#contenu {
	float:right;
	width:1088px;
	height:690px;
	background-color:#9EABBF;
	border:1px solid black;
	}

Mon problème est le suivant :
Lorsque je réduis la fenètre du navigateur, le contenu passe sous le menu or je voudrai qu'il reste à sa place.

Merci d'avance pour votre temps.

[curium]

Bonjour,

On peut définir une largeur minimum pour la page. Comme la somme des largeurs des deux éléments flottants côte à côte est 1248 pixels, ceci devrait permettre de toujours les garder sur la même ligne :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
body
{
  min-width: 1248px;
}

Il faut augmenter cette valeur si jamais il y a des marges ou des bordures qui augmentent la place que prennent les deux éléments flottants.

[Allegro]

Bonjour,
J'ai ajouté le code suivant au début de mon CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
#body
{
min-width:1249px;
}

mais j'ai toujours le même problème.

[Bovino]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

#body{...}

j'imagine que tu as une balise dont l'id est body...

[Allegro]

J'ai également testé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
body
{
min-width:1249px;
}

mais ça ne fonctionne pas non plus.

[curium]

Pour moi cela fonctionne à partir de 1251 pixels. C'est à adapter en fonction de la largeur réelle des éléments flottants. Plus leur largeur réelle (en comptant les marges, les bordures, etc) est grande, et plus il faut augmenter la largeur minimale de l'élément body, afin d'être sûr qu'il y ait de la place pour tout le monde sur une seule ligne.

En cas de problème, il est probable que la valeur 2000 pixels sera suffisante.