Question

这个简单的Bootstrap代码只能在Firefox上正常工作;我没有发现错误？

在Chrome和Safari上，文字没有显示（仅限图片）并且有很大的余量。

 <div class="row">


      <div class="col-sm-6 col-md-6 col-lg-12">

      <div class="media">
       <a class="pull-left" href="#">
          <img class="img-responsive" src="/img/157/big.jpg" alt="abc abc">
       </a>
       <div class="media-body">
          <h4 class="media-heading"><a href="#">Media heading</a></h4>
          This is some sample text. This is some sample text. 
          This is some sample text. This is some sample text.
          This is some sample text. This is some sample text. 
          This is some sample text. This is some sample text.
       </div>
     </div>
    </div>


      <div class="col-sm-6 col-md-6 col-lg-12">

      <div class="media">
       <a class="pull-left" href="#">
          <img class="img-responsive" src="/img/155/big.jpg" alt="abc abc">
       </a>
       <div class="media-body">
          <h4 class="media-heading"><a href="#">Media heading</a></h4>
          This is some sample text. This is some sample text. 
          This is some sample text. This is some sample text.
          This is some sample text. This is some sample text. 
          This is some sample text. This is some sample text.
       </div>
     </div>
    </div>

    </div>

Answer 1

我建议看看Bootstrap网格系统是如何工作的（http://getbootstrap.com/css/#grid）。

您可以在此处查看一个有效的示例：http://www.bootply.com/128356

<div class="media">
    <a class="pull-left" href="#">
       <img class="media-object img-responsive" src="/img/157/big.jpg" alt="abc abc">
    </a>
    <div class="media-body">
       <h4 class="media-heading">Media heading</h4>
       This is some sample text. This is some sample text. 
       This is some sample text. This is some sample text.
       This is some sample text. This is some sample text. 
       This is some sample text. This is some sample text.
    </div>
</div>

Bootstrap Box新闻在Chrome上无效

1 个答案: