我希望每列的内容都居中,但由于某些原因,所有列都相互接触。
我尝试使用margin: 0 auto;
。
这是我的代码:
<div class="container">
<div class="row">
<div class="col-sm-6 col-md-3 col-lg-6 well ">
<img src="http://placehold.it/250x150" class="img-responsive pull-left img-thumbnail" style="margin:5px 10px 0 0" alt="">
<h3><a href = "#">Title</a></h3>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
<a href="#" class="btn btn-success btn-sm pull-right">Read More</a>
</p>
</div>
<div class="col-sm-6 col-md-3 col-lg-6 well ">
<img src="http://placehold.it/250x150" class="img-responsive pull-left img-thumbnail" style="margin:5px 10px 0 0;" alt="">
<h3><a href = "#">Title</a></h3>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
<a href="#" class="btn btn-success btn-sm pull-right">Read More</a>
</p>
</div>
<div class="col-sm-6 col-md-3 col-lg-6 well ">
<img src="http://placehold.it/250x150" class="img-responsive pull-left img-thumbnail" style="margin:5px 10px 0 0" alt="">
<h3><a href = "#">Title</a></h3>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
<a href="#" class="btn btn-success btn-sm pull-right">Read More</a>
</p>
</div>
<div class="col-sm-6 col-md-3 col-lg-6 well ">
<img src="http://placehold.it/250x150" class="img-responsive pull-left img-thumbnail" style="margin:5px 10px 0 0;" alt="">
<h3><a href = "#">Title</a></h3>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
<a href="#" class="btn btn-success btn-sm pull-right">Read More</a>
</p>
</div>
</div><!-- end row-->
</div><!-- end container-->