Bootstrap网格问题(重叠div)

Sil*_*ord 6 html css responsive-design twitter-bootstrap

我知道这个问题已经回答了,但我真的不知道我错了.

我有一个这种结构的网格:

<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>
Run Code Online (Sandbox Code Playgroud)

twitter容器与其他div重叠.我是否对引导类有点麻烦?谢谢您的帮助

And*_*L64 13

您将行直接包装在另一行下.始终尝试在容器或列div下保留一行.

您可以将顶部父行更改为容器,如下所示:

<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>
Run Code Online (Sandbox Code Playgroud)

或者你可以在父行下添加一个col div,如下所示:

<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>
Run Code Online (Sandbox Code Playgroud)