page web et mise en page

Version imprimable

Code:

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
32
33
 
<!DOCTYPE html>
<html>
<head>
	<!--Pour forcer le navigateur à afficher en mode IE9, sans quoi il peut passer en mode quirks.-->
	<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
	<meta charset="utf-8" />
	<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> <!-- application dynamique  -->
	<link rel="shortcut icon" href="image/favs3g.ico" />
	<link rel="stylesheet" media="screen" type="text/css" href="../css/tab.css">
	<title>S 3 G</title>
</head>
<body class="body">
 
      <div class="contenu">   <!--  place pour insérer les pages selon le menu -->
             <div class="general"> // page insérée
 
                       <div class="cont_tablo"> // partie 1 gauche de la page insérée
                          objet tablo
                      </div>
 
                      <div class="contgraph"> // partie 2 droite de la page insérée
                          objet graphe
                      </div>
 
                     <div class="aff_dat_an"> // partie 3 au dessous des deux premières de la page insérée
                            objet  tableau affichage
                     </div>
              </div>
      </div>
 
</body>
</html>

a l'affichage plein écran j'ai la disposition que je veux.
le problème que j'ai:
quand je minimise la fenêtre de firefox , j'ai les div qui se mélange.
comment faire en sorte que la forme reste stable ?
code css3

Code:

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
32
33
34
35
36
37
38
39
 
.body{
font-family: "times new roman",Arial, Helvetica,Verdana,serif;
background:#FFF;  
height:100%;
}			
 
.contenu{
	width: auto;
	height:532px;
	margin-left:  5px;
	margin-right: 5px; 	
	background-color: #E6ECFF; 
 
}
.general{
 
background-color: #E6ECFF; 
margin:auto;
 
}
 
.cont_tablo{
float:left;
position: absolute;
top:130px;
width: auto;
 
}
 
.contgraph{
background-color: #92c3e8; 
float: right;
margin-right: 70px;
}
.aff_dat_an{
float:left;
 
}

voila le code css , a noter que
class="contenu"

25/07/2012, 14h15
Muchos

Vous avez oublié de donner le css ;)

PS : les balises html doivent être en minuscules.
25/07/2012, 19h01
NoSmoking
Bonjour,
il te faut modifier le comportement de la DIV droite qui en float right suit le mouvement et décale le reste.
Code:

1 2 3 4 5 6 .contgraph{ background-color: #92c3e8; /*float: right;*/ /*margin-right: 70px;/**/ margin-left: 350px; /* à adapter */ }
c'est un minimum
26/07/2012, 12h42
redoran

NoSmoking : ta résolution marche , mais un autre problème surgi !!!
A l'affichage plein écran j'ai la disposition que je veux.
le problème que j'ai:
quand je minimise la fenêtre de firefox , j'ai le deuxième div contenant le graphe et le troisième DIV contenant un tableau , tous deux dépasse le DIv principale ( <div class="contenu"> )!!!!!!
26/07/2012, 18h58
NoSmoking

lorsque l'on fait flotter les éléments ils flottent et s'adapte à leur contenu, les parents aussi.

Il faut que tu disciplines cela en imposant une largeur minimum pour tes différents éléments et ce fonction du résultat que tu souhaites.