2017-04-14 22 views
1

私はブートストラップを使用しており、この3枚の画像を一番下に置くことを試みています。手伝ってくれる?区画の下部に3枚の画像を配置

JSFIDDEL

HTML:

<div class="row"> 
<div class="col-xs-2"> 
    <img src="https://s10.postimg.org/730mt4y5l/image.jpg" class="img-responsive first"> 
</div> 
<div class="col-xs-8"> 
    <img src="https://s10.postimg.org/yp3edthih/image.jpg" class="img-responsive second"> 
</div> 
<div class="col-xs-2"> 
    <img src="https://s10.postimg.org/z4j9kkstl/image.jpg" class="img-responsive third"> 
</div> 
</div> 

CSS:

.row { 
    border-bottom: 1px solid red; 
    position: relative; 
} 
.first { 

} 
.second { 

} 
.third { 

} 

3枚の画像は、異なる寸法のものです。私はすべての画像が赤い枠線の上に置かれるようにそれらを配置したいと思います。

+0

これを再開する理由はわかりません。解決方法は他の回答で説明されています。 http://www.codeply.com/go/fw3b4XJ3Pj – ZimSystem

+0

主な問題は、列の高さを同じにすることです – ZimSystem

答えて

0

今のところ、私はmargin_topまたはpadding_topで調整するだけで、メディアスイッチではレスポンシブな規制をしています。

style='margin_top:150px;' 
+0

動作しません。私はそれを試みました。しかし、ありがとう。 –

関連する問題