Forum : Mettre sur la même ligne le titre du site et le menu horizontal

Salut a tous, je souhaiterais aligner le titre de mon site et les onglets dans la barre de menu principal. Mais j'y parviens pas. Je vous prie d'observer les codes ci dessous et de les corriger.

voici mes codes:

**code HTML**
 "<body>
         <nav>
             <h1>Burgure</h1>
             <div class="onglets">
                 <a href="">Home</a>
                 <a href="">Nos produits</a>
                 <a href="">Contact</a>
             </div>
        </nav>
    </body> " 

   ** code CSS**
"nav{
    display: flex;
    flex-wrap: wrap; 
    justify-content: center;
    align-items: center;
    border-bottom: 5px solid #6f6f6f;
   }

nav h1{
    color: #717171; <!--Pour la couleur de Burgure dans le h1-->
    font-family: 'Playfair Display', sans-serif;
    font-size: 30px;
      }"

Ce que je veux
Faire le menu horizontal en alignant le titre de mon site et les onglets dans la barre de menu principal.

Ce que j'obtiens

Mes menus et mon titre ne s'aligne pas sur la meme ligne.

3 réponses

popotte

faut virer le flex-wrap: wrap; ça sert a remettre à la ligne, ou alors réduire la taille de la div onglet pour que le wrap ne s'active pas (mais c'est mieux de faire sans wrap, utilise une média query à la place, flex-direct: column, et à partir d'une certaine taille, flex-direction: row) ;)

Stevar

salut.
en fait tu a fait un flexbox sur ton navigateur. donc ton menu reste forcément en colonne. met aussi ta div onglet en flex plus quelques réglages ça devrait le faire. Je ferais aussi le test.

AHASSA

Auteur

Merci, effet c'etaient les commentaires qui provoquaient le probleme. Encore merci a tous.