créer un menu droit et un menu gauche

ferhat.adel · 06/06/2011, 16h19

bonsoir à tous le monde je voudrais créer un menu droit et un menu gauche
voici mon code mais il ne marche pas

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
 
width:30%;
color:blue;
border: 0.5px solid black;
 position: relative;
   left: 100px;
   top: 10px;
padding:10px;
 
}
.menug
{position:relative;
border: 0.5px solid black;
left: 100px;
   top: 10px;
top:10px;
}

comment faire merci

David55 · 06/06/2011, 16h50

C'est moi ou ton code n'est pas complet!!!!!! Ou est le html? comment s'appelle ton premier style?

Sinon pour positionner ton menu à gauche ou à droite utilise "float".
Exemple:

Code :

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

1
2
3
4
5
6
7
8
9
 
.gauche
{
float: left
}
.droite
{
float: right
}

N'hésite pas à utiliser firebug

ferhat.adel · 06/06/2011, 16h56

salut merci pour votre réponse je voudrais savoir pourquoi on choisit d'utiliser float alors qu'on a la méthode position
s'il vous plait j'arrive pas à comprendre la méthode clear
merci

David55 · 06/06/2011, 17h02

ATTENTION position != float!!!!!!!

Float permet de placer ton bloc à droite ou à gauche par exemple alors que position permet de lui dire si il est absolu ou relative par exemple (avec ceci tu peux mettre un bloc sur un bloc ou autre chose mais ca ne place pas ton bloc à droite ou à gauche)

La propriété "clear" va être utilisée pour définir si un élément doit se trouver sur la même bande horizontale qu’un élément flottant.

ferhat.adel · 06/06/2011, 18h48

salut merci pour ta réponse donc j'ai deux float
je doit utilisé clear both ou pas
merci

David55 · 07/06/2011, 02h30

Normalement tu n'as pas besoin!

12monkeys · 07/06/2011, 10h35

Bonjour

Quelques éléments à lire pour comprendre :
Pour les mises en page : http://pbnaigeon.developpez.com/tuto...e-en-page-CSS/
Pour la propriété clear : http://css.developpez.com/tutoriels/...issement-flux/ et http://css4design.developpez.com/tut...flux-partie-2/

Hyuunkel · 07/06/2011, 12h13

Citation:

Envoyé par ferhat.adel

je voudrais savoir pourquoi on choisit d'utiliser float alors qu'on a la méthode position merci

Salut à toi, tu peux aussi le faire avec la méthode des positions de bloc si tu prefaire, il suffit de mettre tes 2 blocs en absolu contenu dans un bloc relatif (selon tes besoins).

Je t'es fait un exemple avec le bout de code que tu as donné, à toi de l'adapté :

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
32
33
34
35
 
<head>
<style type="text/css">
.contenu {
	position: relative ;
	top: 
	left: 
}
.menud
{
position: absolute ;
width:30%;
color:blue;
border: 0.5px solid black;
left: 100px;
top: 10px;
padding:10px;
 
}
.menug
{
position: absolute ;
border: 0.5px solid black;
left: 100px;
top: 10px;
top:10px;
}
</style>
</head>
<body>
<div class="contenu">
<div class=".menud">blablabla</div>
<div class=".menug">blablabla</div>
</div>
</body>

06/06/2011, 16h56	#3
ferhat.adel Membre à l'essai Inscription : août 2008 Messages : 267 Détails du profil Informations forums : Inscription : août 2008 Messages : 267 Points : 20 Points : 20	remerciement salut merci pour votre réponse je voudrais savoir pourquoi on choisit d'utiliser float alors qu'on a la méthode position s'il vous plait j'arrive pas à comprendre la méthode clear merci
	00

06/06/2011, 17h02	#4
David55 Rédacteur/Modérateur David S. Etudiant en alternance Inscription : août 2010 Messages : 1 167 Détails du profil Informations personnelles : Nom : David S. Âge : 22 Localisation : France, Paris (Île de France) Informations professionnelles : Activité : Etudiant en alternance Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : août 2010 Messages : 1 167 Points : 2 304 Points : 2 304	ATTENTION position != float!!!!!!! Float permet de placer ton bloc à droite ou à gauche par exemple alors que position permet de lui dire si il est absolu ou relative par exemple (avec ceci tu peux mettre un bloc sur un bloc ou autre chose mais ca ne place pas ton bloc à droite ou à gauche) La propriété "clear" va être utilisée pour définir si un élément doit se trouver sur la même bande horizontale qu’un élément flottant. __________________ Vous trouverez ma page perso avec des tutoriels sur Android et BIRT au lien suivant : http://dsilvera.developpez.com N'oubliez pas de voter pour les messages dont la réponse est pertinente (en bas à droite du cadrant) Vous voulez afficher du code : Votre problème est résolu : Pas de question technique par MP ! David55
	00

07/06/2011, 02h30	#6
David55 Rédacteur/Modérateur David S. Etudiant en alternance Inscription : août 2010 Messages : 1 167 Détails du profil Informations personnelles : Nom : David S. Âge : 22 Localisation : France, Paris (Île de France) Informations professionnelles : Activité : Etudiant en alternance Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : août 2010 Messages : 1 167 Points : 2 304 Points : 2 304	Normalement tu n'as pas besoin! __________________ Vous trouverez ma page perso avec des tutoriels sur Android et BIRT au lien suivant : http://dsilvera.developpez.com N'oubliez pas de voter pour les messages dont la réponse est pertinente (en bas à droite du cadrant) Vous voulez afficher du code : Votre problème est résolu : Pas de question technique par MP ! David55
	00

07/06/2011, 10h35	#7
12monkeys Rédacteur/Modérateur Dr. Peters Webmaster Inscription : novembre 2006 Messages : 3 618 Détails du profil Informations personnelles : Nom : Dr. Peters Âge : 35 Localisation : France, Bas Rhin (Alsace) Informations professionnelles : Activité : Webmaster Secteur : Service public Informations forums : Inscription : novembre 2006 Messages : 3 618 Points : 6 238 Points : 6 238	Bonjour Quelques éléments à lire pour comprendre : Pour les mises en page : http://pbnaigeon.developpez.com/tuto...e-en-page-CSS/ Pour la propriété clear : http://css.developpez.com/tutoriels/...issement-flux/ et http://css4design.developpez.com/tut...flux-partie-2/ __________________ Vous débutez dans la creation de sites web : les bases du html et débuter avec les CSS Pas de MP pour des questions techniques ! Mode d'emploi du forum ; Règles ; Pensez à la balise code ; Pas de SMS ! Votez pour les messages qui vous ont aidés...
	00

06/06/2011, 18h48	#5
ferhat.adel Membre à l'essai Inscription : août 2008 Messages : 267 Détails du profil Informations forums : Inscription : août 2008 Messages : 267 Points : 20 Points : 20	salut merci pour ta réponse donc j'ai deux float je doit utilisé clear both ou pas merci
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email