Menu Horizontal justifié
mlaniew123
Messages postés
16
Statut
Membre
-
mlaniew123 Messages postés 16 Statut Membre -
mlaniew123 Messages postés 16 Statut Membre -
Bonjour,
Je suis nouvelle et tente de faire mon petit site internet. Chose pas facile! Les éléments se mettent en placent, mais je suis bloquée sur le menu.
J'aimerais qu'il prenne la largeur de mon site et soit justifié.
Pour un exemple plus concret, voici ma page:
www.wintersdorff.fr
Et voici mes codes de menu:
Je suis nouvelle et tente de faire mon petit site internet. Chose pas facile! Les éléments se mettent en placent, mais je suis bloquée sur le menu.
J'aimerais qu'il prenne la largeur de mon site et soit justifié.
Pour un exemple plus concret, voici ma page:
www.wintersdorff.fr
Et voici mes codes de menu:
#menu .container {
z-index : 1001;
top : 0;
margin : 0 0 0 0;
width : 800px;
}
#menu {
float :left;
height : auto;
padding : 0 0 0 0;
}
#menu p {
color : #000000;
width : auto;
font-family : Arial;
text-align : left;
padding : 0 0 0 0;
margin : 0 0 0 0;
}
#menu ul {
float : right;
width : auto;
list-style : none;
overflow : auto;
margin : -20px 0 10px 12px;
}
#menu ul li.section-title { /* property of the section titles */
font-family : Arial;
color : #1A171B;
font-size : 1.5em;
font-style : normal;
text-align : right;
text-decoration : none;
width : auto;
padding : 0 0 2px 0;
margin : 0 3px 5px 0;
}
#menu ul li.section-title:hover {
color : #1A171B;
}
#menu ul li { /* property of the projects/exhibitions titles */
font-family : Arial;
text-align : left;
font-size : 1em;
width : 100px;
line-height : 150%;
margin : 0 0 0 0;
}
#menu ul a:link {
padding : 0 0 0 0;
text-decoration : none;
color : #1A171B;
}
#menu ul a:active { /* couleur sous-menu */
padding : 0 0 0 0;
text-decoration : none;
color : #1A171B;
}
#menu ul a:visited { /* sous-menu visité */
padding : 0 0 0 0;
text-decoration : none;
color : #1A171B;
}
#menu ul a:hover { /* sous-menu hover */
padding : 0 0 0 0;
font-style : bold;
color : #1A171B;
}
A voir également:
- Menu Horizontal justifié
- Menu déroulant excel - Guide
- Canon quick menu - Télécharger - Utilitaires
- Windows 11 menu contextuel classique - Guide
- Windows 11 menu démarrer classique - Guide
- Word supprimer espace entre mots justifié ✓ - Forum Word
3 réponses
Salut mlaniew123,
Pour que ton menu prenne la largeur de ta page internet il te suffit de définir sa largeur dans ton code CSS. Tu n'as qu'à rajouter width : 100%;
Pour ce qui est de la justification de ton texte, il te suffit de préciser :
text-align: justify;
Dis moi si cela a marché.
Sympa ton site au passage
Pour que ton menu prenne la largeur de ta page internet il te suffit de définir sa largeur dans ton code CSS. Tu n'as qu'à rajouter width : 100%;
Pour ce qui est de la justification de ton texte, il te suffit de préciser :
text-align: justify;
Dis moi si cela a marché.
Sympa ton site au passage
Merci Yelem pour ton message.
En fait je suis incapable de placer ces codes dans mon css.
A quel niveau je dois les placer?
#menu ul li.section-title
à ce niveau là?
:)
En fait je suis incapable de placer ces codes dans mon css.
A quel niveau je dois les placer?
#menu ul li.section-title
à ce niveau là?
:)
Salut,
Comme vous devez vous en douter #menu ul li.section-title indique les styles de toutes les classes "section-title" dans une liste non ordonée(li de ul) regroupée par une balise(problablement un div) d'identifiant unique(id): "menu".
Bref chaque li de ul (section-title)est une case du menu, donc si vous indiquez 100% de l place il risque d'y avoir un problème.
Essayez plutôt sur le bien nommé container qui a pour l'instant 800px de largeur de remplacer par 100%.
#menu .container {
z-index : 1001;
top : 0;
margin : 0 0 0 0;
width : 800px;
}
La mise en page étant dépandante d'une largeur fixe il faudra peut être ajuster les autres éléments en fonction(il sont pas en arrière plan par le css, donc je suppose que ce sont des images dans le html).
Comme vous devez vous en douter #menu ul li.section-title indique les styles de toutes les classes "section-title" dans une liste non ordonée(li de ul) regroupée par une balise(problablement un div) d'identifiant unique(id): "menu".
Bref chaque li de ul (section-title)est une case du menu, donc si vous indiquez 100% de l place il risque d'y avoir un problème.
Essayez plutôt sur le bien nommé container qui a pour l'instant 800px de largeur de remplacer par 100%.
#menu .container {
z-index : 1001;
top : 0;
margin : 0 0 0 0;
width : 800px;
}
La mise en page étant dépandante d'une largeur fixe il faudra peut être ajuster les autres éléments en fonction(il sont pas en arrière plan par le css, donc je suppose que ce sont des images dans le html).
Bonjour Bornel,
Pour la petite histoire, je créée mon site à partir de l'application web Indexhibit, et souhaite customizer le tout. Je ne maitrise pas les css et autres choses de web :) Mais petit à petit j'avance.
Concernant les menus, je suis perdue.Ca fait quinze jours que je suis dessus, en essayant de modifier les éléments un par un pour voir ce que ça donne sur mon site.
J'ai bien modifié le width: 100%
Mais rien. Mon menu est désormais centré :)
www.wintersdorff.fr
Pour la petite histoire, je créée mon site à partir de l'application web Indexhibit, et souhaite customizer le tout. Je ne maitrise pas les css et autres choses de web :) Mais petit à petit j'avance.
Concernant les menus, je suis perdue.Ca fait quinze jours que je suis dessus, en essayant de modifier les éléments un par un pour voir ce que ça donne sur mon site.
J'ai bien modifié le width: 100%
Mais rien. Mon menu est désormais centré :)
www.wintersdorff.fr
