web-dev-qa-db-fra.com

bootstrap colonne pleine largeur

J'ai cette question depuis un moment, mais je ne trouve pas de réponse raisonnable.

Bootstrap indique ce qui suit: Le contenu doit être placé dans des colonnes, et seules les colonnes peuvent être des enfants immédiats de lignes.

Mais lorsque j'ai une rangée et que je dois placer un div pleine largeur en dessous, que dois-je faire? Dois-je mettre un col-xs-12? Par exemple

<div class="row">
    <h1>Title</h1>
    <div class="col-md-6">Some content here</div>
    <div class="col-md-6">Other content here</div>
</div>

Le h1 est pleine largeur.

Selon bootstrap ce n'est pas correct de le faire, alors comment dois-je le faire? Dois-je placer le h1 dans une colonne ou non?

twitter-bootstrapgrid
12
Stathis G.

Une ligne est un seul groupe horizontal de colonnes, donc l'élément h1 Appartient au-dessus de la ligne:

<h1>Title</h1>
<div class="row">
    <div class="col-md-6">Some content here</div>
    <div class="col-md-6">Other content here</div>
</div>

Ou dans sa propre ligne qui utilise une seule colonne pleine largeur, mais ce n'est pas nécessaire:

<div class="row">
    <div class="col-md-12">
        <h1>Title</h1>
    </div>
</div>
<div class="row">
    <div class="col-md-6">Some content here</div>
    <div class="col-md-6">Other content here</div>
</div>
11
JohnnyHK
<div class="row">
    <h1>Title</h1>
</div>
<div class="row">
    <div class="col-md-6">Some content here</div>
    <div class="col-md-6">Other content here</div>
</div>

Vous devriez utiliser des cols, si vous ne savez pas ce que vous faites. Le fait est que les cols ont un padding-left 15px et un padding-right 15px. Et les lignes ont margin-left -15px et margin-right -15px. Si vous utilisez des divs en lignes sans cols:

<div class="row">
    <div>
        content
    </div>
</div>

alors vous obtenez un problème d'indentation à gauche et à droite, si vous le mélangez avec:

<div class="row">
    <div class="col-...">
        content
    </div>
</div>

Par conséquent, il est toujours préférable de le faire avec des cols.

4
Sun