1

在几乎从 1020px 开始的某些分辨率下，我使用偏移量居中的引导 col 无法正常工作。如何解决此问题..

<section id="content" class="m-t-lg" style="margin-top:100px;"> 
   <a class="nav-brand" href="#">My Home page</a>
  <div class="row m-n">
    <div class="col-md-6 col-md-offset-3 m-t">

      <form class="m-t-lg" role="search" >
        <div class="input-group">
          <input class="form-control input-lg no-border bg-dark" type="text" placeholder="Search">
          <span class="input-group-btn">
          <button class="btn btn-lg btn-success" type="submit"> <i class="icon-search"></i> </button>
          </span> </div>
      </form>
      <center>
     <section class="panel-body">
      <div class="row m-n m-t"><h4 align="center">Heading1</h4>
        <ul class="pull-left">
          <li class="list-inline pull-left m-r-sm"> <a href="#"><img src="images/img_2.png" alt="img" class="img-responsive"></a> </li>
          <li class="list-inline pull-left m-r-sm"> <a href="#"><img src="images/img_2.png" alt="img" class="img-responsive"></a> </li>
          <li class="list-inline pull-left m-r-sm"> <a href="#"><img src="images/img_2.png" alt="img" class="img-responsive"></a> </li>
        </ul>
      </div>
      </section>

              <section class="panel-body">
       <h4 align="center">Heading2</h4>

        <ul "pull-left">
          <li class="list-inline pull-left  m-r-sm"> <a href="#"><img src="images/img_2.png" alt="img"></a> </li>
          <li class="list-inline pull-left  m-r-sm"> <a href="#"><img src="images/img_2.png" alt="img"></a> </li>
          <li class="list-inline pull-left  m-r-sm"> <a href="#"><img src="images/img_2.png" alt="img"></a> </li>
        </ul>
        </section>

    </div>
  </div>
</section>
4

1 回答 1

3

除非您没有在示例中包含它，否则您将缺少 Bootstrap 101 规则。

行必须放置在.container中以进行正确对齐和填充。

根据您的示例，<section>用 a 包装您的标签<div class="container">会有所帮助。我无法复制您似乎遇到的任何问题，并且必须指出@kkern 可能已经解决了该问题，而没有意识到您的堆栈示例中缺少容器。

<div class="container">
   <section id="content" class="m-t-lg" style="margin-top:100px;">
   ........
于 2013-11-08T15:04:38.293 回答