Bootstrap <div class=“navbar navbar-fixed-top”>

Je suis en train de construire un site avec Bootstrap. Jusqu'à présent, tout se passe à peu près comme prévu. Je voudrais une barre de navigation fixe et je suis en utilisant le construit en fonction:

<div class="navbar navbar-fixed-top">

Ce qui est excellent et juste ce dont j'ai besoin, MAIS je voudrais la navigation et le titre pour commencer à la même place que le contenant plutôt que de tout le chemin vers la gauche/droite (toujours avoir la barre de navigation passe à 100% en largeur. J'ai essayé de mettre un récipient à l'intérieur de la barre de navigation qui n'était pas la bonne solution 🙂

OriginalL'auteur Kasper Lægård | 2013-07-08

  1. 9

    exemple

    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="brand" href="./index.html">Bootstrap</a>
          <div class="nav-collapse collapse">
            <ul class="nav">
              <li class="active">
                <a href="./index.html">Home</a>
              </li>
              <li>
                <a href="./getting-started.html">Get started</a>
              </li>

              ...

              <li>
                <a href="./customize.html">Customize</a>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>

    ou de jeter

    .navbar { 
    max-width: 1170px; /* width of .container */
    margin: 0 auto;
}

    dans le css

    Salut À Austin. Cela fonctionne comme un charme! J'ai essayé le conteneur à l'intérieur du menu, mais sans succès, peut-être mis sur le mauvais côté de la navbar-inner??? De toute façon... parfait maintenant!

    OriginalL'auteur Austin Pray

  2. 1

    Vous devriez avoir un conteneur de classe imbriquée à l'intérieur de votre barre de navigation

    <div class="navbar navbar-fixed-top">
   <div class="container">your menu and logo go here</div>
</div>

    Qui va vous donner la même largeur que le corps de récipient si vous ne disposez pas d'un design fluide et donnera auto marges pour le récipient de sorte qu'il est centré au milieu de l'écran. Il permettra également de garder la barre de navigation lui-même à 100%

    OriginalL'auteur Tim Joyce