你是否应该在一行中有一行，否则会导致问题？

Question

我正在查看这个使用 bootstrap 3.3.

的项目

有一个布局页面具有：

  <div class="container">
    <div class="row">
       <div class="col-sm-12 main">
           @RenderBody()
       </div>
    </div>  
  </div>

因此内页（将在@RenderBody() 中呈现）看起来像：

<div class="col-md-12>
   <div class="row">
        // content goes here
   </div>
</div>

目前在移动设备上显示混乱。这是非常错误的正确的，或者在技术上可以有一个带有一行的容器，然后在父行内有一行？

Answer 1

使用Bootstrap 3 绝对可以有像

这样的结构

<div class="container">
  <div class="row">
    <div class="col-sm-12 main">
      <div class="row">
        // content goes here
      </div>
    </div>
  </div>  
</div>

首先，您在示例中忘记了 "。

.container 和 .col 有 padding-left: 15px; padding-right: 15px;。而 .row 有 margin-left: -15px; margin-right: -15px;，所以你可以在 .container 和 .col 中使用 .row。但是在 .row 元素之后应该有任何 .col 子元素，以补偿负边距。

<div class="container">
  <div class="row">
    <div class="col-sm-12 main">
      <div class="row">
        <div class="col-sm-12">
        // content goes here
        </div>
      </div>
    </div>
  </div>  
</div>

你是否应该在一行中有一行，否则会导致问题？

Should you ever have a row inside of a row or this will cause problems?

css

twitter-bootstrap

twitter-bootstrap-3