J'ai un problème avec le système de grille de bootstrap, j'ai 6 éléments à l'intérieur d'une rangée, chacun avec la classe définie sur "col-md-2", le problème est que le seulement les 5 premiers éléments sont montrés sur la rangée, et les 6º sauts à la 2ème rangée. Donc, la 2ème rangée obtient des espaces vides.Bootstrap grille système contenu de ligne chevauchant l'autre rangée
Voir l'image.
un morceau de code:
<div id="card-listing" class="container-fluid">
<div class="row">
<div class="col-sm-6 col-md-2 cardthumnb" data-time="1396739650" data-name="Graceful Charity">
<a id="card-55" href="http://127.0.0.1/~victor/yugiohguia/cards/graceful-charity/">
<div class="card-thunmb">
<img src="http://127.0.0.1/~victor/yugiohguia/wp-content/uploads/2014/04/GracefulCharity-LCYW-EN-ScR-1E.png" />
</div>
<div class="card-title">
<span>Graceful Charity</span>
</div>
</a>
</div>
<!-- other 5 images... -->
</div>
</div>
le seul css appliqué est:
.cardthumnb img {
max-width: 100%;
white-space: normal;
}
.cardthumnb .card-title {
text-align: center;
}
Dans votre question, vous avez dit que chaque classe est définie comme 'col-md-6' mais elle est définie comme' col-md-2' dans votre code. Lequel utilisez-vous réellement? La bonne devrait être 'col-md-2'. – lvarayut
Désolé, je suis confus, ouais c'est en fait col-md-2 dans le code. –
Ça devrait marcher. Pouvez-vous mettre votre code dans [jsFiddle] (http://jsfiddle.net)? – lvarayut