mise en forme page web

**samsoumitta** · 07/03/2010, 00h57

Bonjour,
je veut partager une page web en 3 partie: entête, menu (partie gauche) et contenu (partie droite) et je veut que leurs tailles soit égale à la taille du fenêtre càd l'entête et menu leur taille soit fixe et celle de contenu varie selon la fenêtre.

j'ai utilisé la balise div et une feuille de style CSS mais ça ne marche pas

voici le code (j'ai utilisé les couleur pour distinguer les 3 parties):

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
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<link rel="stylesheet" media="screen" type="text/css" title="Design" href="../Style/help.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div id="content">
        <div id="entete">
        <p>entête</p>
        </div>
        <div id="partie_gauche">
        <p>partie gauche</p>
        </div>
        <div id="partie_droite">
        <p>partie droite</p>
        </div>
    </div>
    </form>
</body>
</html>

help.css

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
body
{
	width: 100%; 
	height: 100%;
	margin: auto;
	margin-bottom: 20px;
	text-align: center;
}
 
#entete
{
    background-color:#0041db; 
	width: 100%;
	height: 50px;
	margin: auto;
	border-width: 1px;
}
#partie_gauche
{
    background-color: #00b3ff;
    float: left;
	width: 170px;
	padding: 0px;
}
#partie_droite
{
    background-color: #d6f5ff;
    float: left;
    height: 100%;
	padding: 0px;
}

**nsanabi** · 07/03/2010, 05h07

je pense que la structure de ton html est correcte, malgré la form qui entoure tout le contenu, mais c'est sans souci (je devine que ta page est une aspx).

ton problème viens probablement de tes CSS, en déplaçant ton topic vers le bon forum tu aura certainement plus de réponses.
en attendant l'intervention d'un modérateur et la réponse d'un spécialiste, voici mes remarques :

l'entête et menu leur taille soit fixe

pourtant ton entete n'a pas une taille fixe dans tes regles css :

Code :

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

1
2
3
4
5
6
7
8
9
#entete
{
    background-color:#0041db; 
	width: 100%; //remplacer par une taille exmple width:900px;
	height: 50px;
	margin: auto;
	border-width: 1px;
}

par contre ta div partie_droite possèdera un width de 100%

mise en forme page web

CSS

Discussions similaires

Partager

Partager