ブートストラップを使用して中央の水平イメージを中心に

私は画像を返すmysqli_fetch_assocを持っています。私はこれらの画像をすべて水平に中央に置く必要があります。私はこのすべてでセンターブロックを使用しようとしますが、センターと他のイメージはダウンします。例えばブートストラップを使用して中央の水平イメージを中心に

：

<body> 

<div class="col-xs-12"> 

<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30" class="center-block"> 
<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30" class="center-block"> 
<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30" class="center-block"> 

</div> 
</body>

https://jsfiddle.net/96czjmoh/

：mysqlは私の3枚の画像を与える場合

<body> 

<div class="col-xs-12"> 

<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30" class="center-block"> 
<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30" class="center-block"> 

</div> 
</body>

https://jsfiddle.net/ff4rj8zs/

：

mysqlのは私に2枚の画像を与えた場合

ご覧のとおり、画像はダウンし、同じ行には残りません。私はすべての画像が量とは無関係に同じラインの中央にとどまることが必要です。

ありがとうございます！

出典

2017-08-17 Francis Dotkam

使用この：

<body> 

<div class="col-xs-12 text-center"> 

<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30"> 
<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30"> 
<img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30"> 

</div> 
</body>

参照：https://jsfiddle.net/ff4rj8zs/3/

出典

2017-08-17 23:17:09 JoostS

が、これはあなたが後にしている何ですか？

<div class="col-xs-12 text-center"> 
 
    <div class="row"> 
 
    <div class="col-xs-12 col-sm-4 col-md-3-"> 
 
     <img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30"> 
 
    </div> 
 
    <div class="col-xs-12 col-sm-4 col-md-3-"> 
 
     <img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30"> 
 
    </div> 
 
    <div class="col-xs-12 col-sm-4 col-md-3-"> 
 
     <img src="http://osolephp.com.es/grafa/imagenes/imagenesropa/cocinas_6.png?30"> 
 
    </div> 
 
    </div> 
 
</div>

出典

2017-08-17 23:22:24 Jcode

ブートストラップを使用して中央の水平イメージを中心に

答えて

関連する問題