将内容放置在引导程序中的布局中

Question

我正在使用引导程序3.我想将内容（包括3个图像）包含在红色框架宽度的中间。

https://codepen.io/anon/pen/WZyrYq

HTML：

<div class="container"> 
    <div class="row me"> 
     <div class="col-lg-3 many-cols-centered"> 
      <img src="http://via.placeholder.com/300"> 
     </div> 
     <div class="col-lg-3 many-cols-centered"> 
      <img src="http://via.placeholder.com/300"> 
     </div> 
     <div class="col-lg-3 many-cols-centered"> 
      <img src="http://via.placeholder.com/300"> 
     </div> 
    </div> 
</div> 

CSS：

.container{ 
    border:solid 1px red;padding:0;box-sizing:border-box 
} 
.me{text-align:center} 
.many-cols-centered { 
    float: none; 
    display: inline-block;padding:0 
} 

Answer 1

你的意思是这样的？

如果是这样，你可以做这样的事情：

<div class="container"> 
<div class="row me"> 
    <h>Hello my friend</h> 
    <div "col-lg-12"> 
    <div class="col-lg-3 many-cols-centered"> 
    <img src="http://via.placeholder.com/300"> 
    </div> 

    <div class="col-lg-3 many-cols-centered"> 
     <img src="http://via.placeholder.com/300"> 
    </div> 

    <div class="col-lg-3 many-cols-centered"> 
     <img src="http://via.placeholder.com/300"> 
    </div> 
    </div> 
</div>