Bootstrap grille de problèmes (chevauchement des divs)

Je sais que cette question a déjà répondu, mais je n'ai vraiment pas aller là où je me trompe.

J'ai une grille avec cette structure:

<div class="row">
<div class="row">
<div class="left_content col-lg-8 col-sm-12">
<div class="row">
<div class="news_report col-lg-6 col-sm-6">
</div>
<div class="news_report col-lg-6 col-sm-6">
</div>
</div>
<div class="row">
<div class="recursos_container col-xs-6">
</div>
<div class="more_info_container col-xs-6">
<div class="alerts_container">
</div>
<div class="acces_to_catalog_container">
</div>
</div>
</div>
<div class="row">
<div class="app_info_container col-xs-12">
<div class="app_left_content">
</div>
<div class="app_right_content">
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="right_content col-lg-4 col-sm-12">
<div class="row">
<div class="twitter_container">
<div class="twitter_header">
</div>
<div class="twitter_content">
</div>
</div>
</div>
<div class="row">
<div class="blog_container">
<div class="blog_side_header">
</div>
<div class="blog_side_content">
<div class="blog_side_post">
</div>
<div class="blog_side_post">
</div>
<div class="blog_side_post">
</div>
<div class="blog_side_post">
</div>
</div>
<div class="blog_side_footer">
</div>
</div>
</div>
</div>
</div>
</div>

Le twitter conteneur se chevauchent, les autres divs. Dois-je faire un peu de désordre avec le bootstrap classes?

OriginalL'auteur Silvio Zoidberg Sdord | 2015-03-04

  1. 12

    Vous enveloppant d'une ligne directement en vertu d'une autre ligne. Essayez de toujours garder une ligne sous un conteneur ou une colonne div.

    Vous pouvez modifier le parent top ligne de conteneur comme ceci:

    <div class="container">
<div class="row">
<div class="left_content col-lg-8 col-sm-12">
<div class="row">
<div class="news_report col-lg-6 col-sm-6">
</div>
<div class="news_report col-lg-6 col-sm-6">
</div>
</div>

    OU vous pouvez ajouter un col div sous la ligne parent comme ceci:

    <div class="row">
<div class="col-xs-12">
<div class="row">
<div class="left_content col-lg-8 col-sm-12">
<div class="row">
<div class="news_report col-lg-6 col-sm-6">
</div>
<div class="news_report col-lg-6 col-sm-6">
</div>
</div>
    Merci il fonctionne maintenant 🙂

    OriginalL'auteur AndrewL64

  2. 0

    Essayez de suivre le Bootstrap, documentation à l'aide de la .conteneur > .ligne > structure de colonne:

    <div class="container">
<div class="row">
<div class="col-md-*">
</div>
</div>
</div>

    Où l'astérisque est la taille que vous tentez d'utiliser. Je ne suis pas sûr de savoir pourquoi vous avez une ligne imbriquée dans une rangée imbriquée dans une rangée.

    Si vous voulez qu'elle soit pleine largeur, remplacez-le .classe de conteneur .conteneur de fluide.

    OriginalL'auteur plushyObject

  3. 0

    En regardant votre marge et votre question n'est pas trop de dire.

    Vous êtes en train de faire quelque chose comme ceci:

    <div class="row">
<div class="row">
<div class="left-content col-lg-8"></div>
</div>
<div class="row">
<div class="right-content col-lg-4"></div>
</div>
</div>

    Qui représente une ligne en dessous des autres.
    Mais, peut-être vous cherchez quelque chose comme ceci:

    <div class="row">
<div class="left-content col-lg-8"></div>
<div class="right-content col-lg-4"></div>
</div>

    Qui est une ligne divisée en deux sections avec différentes largeur.

    OriginalL'auteur Patrick