twitter-bootstrap - Bootstrap 列太靠近屏幕边缘

Question

我是 Bootstrap 新手，正在努力获得我想要的定位。内容太靠近浏览器的边缘，而不是更靠近中间(见图)我尝试了一些CSS，它确实有帮助，但仍然不正确，所以我把它拿出来了。我确实尝试使用最大宽度，这使它更小，但后来我无法将它放在中心。

<div class="main-container">
<div class="row">
   <div class="col-md-12">
      <h1 class="contactformch1">
         CONTACT
      </h1>
   </div>
</div>
<div class="row">
<div class="col-md-12">
<div class="row">
   <div class="col-md-4 text-center">
      <h4>
         Heading
      </h4>
      <p>
         Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
      </p>
      <p>
         <a class="btn" href="#">View details »</a>
      </p>
   </div>
   <div class="col-md-4 text-center">
      <h4>
         Heading
      </h4>
      <p>
         Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
      </p>
      <p>
         <a class="btn" href="#">View details »</a>
      </p>
   </div>
   <div class="col-md-4 text-center">
      <h4>
         Heading
      </h4>
      <p>
         Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
      </p>
      <p>
         <a class="btn" href="#">View details »</a>
      </p>
   </div>
</div>
<div class="row">
<div class="col-md-12">
   <h5 class="text-center">
      h3. Lorem ipsum dolor sit amet.
   </h5>
</div>

Answer 1

我猜你使用<div class="container-fluid"在上面。如果是这种情况，请尝试 <div class="container" .

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

查看 bootply 上的效果.