Bootstrap grille fixe wrapper - Prévenir les colonnes de l'empilage jusqu'

Comme le dit le titre je suis en train d'utiliser Bootstrap 3 système de grille fixes avec un wrapper. Mais quand j'ai redimensionner le Navigateur les colonnes de la pile, même si le papier reste la même taille?

BTW: j'utilise la version 3 de sorte que je peux me déplacer pour une mise en page responsive après j'ai porté le site. (Ce qui est énorme et je suis seul, donc, étape par étape, c'est la seule option ...)

    <!DOCTYPE html>
    <html>
      <head>
        <title>Bootstrap 101 Template</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- Bootstrap -->
        <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

        <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!--[if lt IE 9]>
          <script src="../../assets/js/html5shiv.js"></script>
          <script src="../../assets/js/respond.min.js"></script>
        <![endif]-->

        <style>
                /* Custom container */
                .container-fixed {
                  margin: 0 auto;
                  max-width: 800px;
                  min-width: 800px;
                  width: 800px;
                                      background-color:#C05659;
                }
                .container-fixed > hr {
                  margin: 30px 0;
                }
        </style>
      </head>
      <body>
            <div class="container-fixed">
                <div class="row">
                  <div class="col-md-4">.col-md-4</div>
                  <div class="col-md-4">.col-md-4</div>
                  <div class="col-md-4">.col-md-4</div>
                </div>
                <hr>
            </div>

        <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
        <script src="http://code.jquery.com/jquery.min.js"></script>
        <!-- Include all compiled plugins (below), or include individual files as needed -->
        <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
      </body>
    </html>

OriginalL'auteur stare | 2013-09-10

  1. 51

    La sm,md,lg,etc.. cols wrap/pile de réactivité. Utiliser le non cumulables col-xs-* classe...

    <div class="container">
  <div class="row">
    <div class="col-xs-4">.col-4</div>
    <div class="col-xs-4">.col-4</div>
    <div class="col-xs-4">.col-4</div>
  </div>
</div>

    Démo: http://bootply.com/80085

    EDIT: Bootstrap 4, le xs n'a plus besoin d'être spécifié..

    <div class="container-fluid">
  <div class="row">
    <div class="col-4">.col-4</div>
    <div class="col-4">.col-4</div>
    <div class="col-4">.col-4</div>
  </div>
</div>
    Merci, je me sens vraiment gênée de ne pas voir de moi-même dans la "grille" options de la section: getbootstrap.com/css/#grid
    Je ne peux pas remercier assez d'u

    OriginalL'auteur Zim