FORUM D’ENTRAIDE INFORMATIQUE (FEI)
Site d’assistance et de sécurité informatique

HTML/CSS : Centrer le contenu d'un nav

Règles du forum : Entraide concernant la programmation informatique en général, tous langages : recherche ou correction d'un code ou d'une fonction, aide à la réalisation d'un projet...
Pour la programmation web (HTML, CSS, PHP, MySQL...), il est conseillé de s'orienter dans le forum Webmastering.
Merci de lire et de respecter la charte générale du forum.

Répondre

Afin d’empêcher la création automatisée de comptes, nous vous demandons de réussir le défi ci-contre.
Smileys
:D :) :-) ;) :| :( :cry: :cheers: :hourra: :mv: :lol: :mdr: :bonjour: :hello: :jap: :siffle: :bisou: :P :o :x :roll: :good: :bad: :super: :reflexion: :suspect: :? :oops: :peur: :zen: :boude: :bug:

Revue du sujet : HTML/CSS : Centrer le contenu d'un nav Étendre la vue

Re: HTML/CSS : Centrer le contenu d'un nav

par 2011N2 » lun. 26 oct. 2015 08:19
Bonjour,

Mmmmh d'accord, regarde ici quelqu'un avait un souci similaire au tien et a finalement trouvé un code qui a résolu son souci (dernier message) : https://openclassrooms.com/forum/sujet/ ... responsive

Tente, ça pourrait fonctionner.

Gabriel.

Re: HTML/CSS : Centrer le contenu d'un nav

par Âze » dim. 25 oct. 2015 19:59
J'ai essayer le "text-align: center", "margin", "padding" dans le CSS.
Et la balise "<center>" en HTML.
Le truc, c'est qu'avec le padding ça peut fonctionner, mais c'est pas responsive... :/

Re: HTML/CSS : Centrer le contenu d'un nav

par 2011N2 » dim. 25 oct. 2015 13:58
Salut,

Donc tu souhaites centrer le texte style "Accueil", "Compétences"... dans ton menu c'est bien ça ?
Âze a écrit :J'ai essayer avec des "text-align : center" et d'autres choses comme cela, mais sans succès... :/
Tu te souviens de ce que tu as testé exactement stp ? Et je suppose que tu as déjà essayé cette balise :
Code : Tout sélectionner
<center>test</center>
Gabriel.

HTML/CSS : Centrer le contenu d'un nav

par Âze » sam. 24 oct. 2015 23:44
Bonjour bonsoir !

J'ai un petit soucis sur mon site (qui est sur un serveur de test)
J'ai mon menu permettant la navigation entre les différentes pages, mais j'ai un GROS soucis.
Je dis "gros" car j'ai déjà fait pas mal de recherches et essayer différentes solutions potentielles, mais aucune n'a fonctionné jusqu'ici...

Voici le code :

[tabs][tabs: HTML]
Code : Tout sélectionner
<li class="dropdown active"> <a href="index.php"> <span class="glyphicon glyphicon-home"></span> Accueil </a> </li>
<li> <a href="porteFeuille.php"> <span class="glyphicon glyphicon-list-alt"></span> Compétences </a> </li>
<li> <a href="veilles.php"> <span class="glyphicon glyphicon-eye-open"></span> Veilles </a> </li>
<li> <a href="memento.php"> <span class="glyphicon glyphicon-folder-open"></span> Memento </a> </li>
[tabs: CSS]
Code : Tout sélectionner
nav{
    background-color: #FFAA00; /*la couleur de fond du bandeau de navigation*/
    border-radius: 10px; /*Arrondit les angles*/
    padding: 0; /*Important*/
    margin: auto;    
    border: 3px solid #000000; /*Largeur du contour - - Couleur du contour*/
    width: 30%;
}

.nav > li > a:hover, .nav > li > a:focus {
    color: #FFAA00; /*Couleur du texte lors du survol de la souris*/
    background-color: #000000; /*Couleur de fond de l'onglet lors du survol de la souris*/
    cursor: pointer;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #FFAA00; /*Couleur du texte ACTIF*/
    background-color: #000000; /*Couleur de fond de l'onglet ACTIF*/
    cursor: text;
}
[/tabs]

Tout le code présent est entièrement utile (en gros on me retire une ligne, ça me modifie vraiment l'interface graphique)
J'ai essayer avec des "text-align : center" et d'autres choses comme cela, mais sans succès... :/

Des petites idées pour m'aider s'il vous plait (oui la rime est calculée ;) )

Hello Désolé , mais je ne compren[…]

image

Bonjour, Je viens d'appliquer l'excellent tutu de […]

aide pour logiciel Adobe

Bonjour a tous, je suis nouveau sur le forum et je[…]

Fenêtre Taskend.exe

https://forum.pcastuces.com/img/55eeddd3909225e05[…]