如何在使用引导时删除页边距

Question

当我的屏幕是全宽的时候，我想在一条线上定位是有问题的。col 4一直被定位在col 1下面。

      <div class="products">
            <div class="container">
              <div class="row">
                <h2>Products</h2>
                  <div class="col-sm-3">
                <div id="cat-1">
                  <p>1</p>
                </div>
              </div>

              <div class="col-sm-3">
                <div id="cat-2">
                  <p>2</p>
                </div>
              </div>

              <div class="col-sm-3">
                <div id="cat-3">
                  <p>3</p>
                </div>
              </div>

              <div class="col-sm-3">
                <div id="cat-4">
                  <p>4</p>
                </div>
              </div>

          </div>
        </div>
      </div>

Answer 1

标题正在破坏布局。只允许将列用作.row的子列。

​

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<div class="products">
   <div class="container">
      <div class="row">
          <div class="col-sm-12">
              <h2>Products</h2>
          </div>
      </div>
      <div class="row">
         <div class="col-sm-3">
            <div id="cat-1">
               <p>1</p>
            </div>
         </div>
         <div class="col-sm-3">
            <div id="cat-2">
               <p>2</p>
            </div>
         </div>
         <div class="col-sm-3">
            <div id="cat-3">
               <p>3</p>
            </div>
         </div>
         <div class="col-sm-3">
            <div id="cat-4">
               <p>4</p>
            </div>
         </div>
      </div>
   </div>
</div>

​