2016-10-01 19 views
1

とブートストラップCOL最大の高さ:私は3枚の画像と、ブートストラップ上の行を作ってみる画像

image http://img4.hostingpics.net/pics/908828bootstrap001.jpg

しかし、私は、行の2 COLを持っていると思いますか...知らない、と画像Bと画像Cを持つ2番目の列は、画像Aのサイズで決まる最初の列と同じサイズでなければなりません。これを行おうとすると2番目の列の高さのサイズになります。画像BおよびCのサイズに基づいて決定される。0123ランダムなサイズを持つことができます。答えに関連

備考:

列という意味で、画像BおよびCの高さの添加の実際のサイズが大きい場合であっても、最初の列の常に大きさでなければなりません画像BとCは、の高さの最初の列に合うようにサイズを調整する必要があります。テストのために、2番目の列(画像Aの高さ) 。

ご協力いただきありがとうございます。

答えて

2

ネストされた行を持つことができます。最初の行は2つの列に分割されます。最初の列は画像Aを含む第2列は、1つの列、1内の画像Bの各&画像C.

<div class="row"> 
    <div class="col-xs-6"> 
     <img src="image-a"> 
    </div> 
    <div class="col-xs-6"> 
     <div class="row"> 
      <div class="col-xs-12"> 
       <img src="image-b"> 
      </div> 
      <div class="col-xs-12"> 
       <img src="image-c"> 
      </div> 
     </div> 
    </div> 
</div> 

2つの行があり、この参照:http://codepen.io/anon/pen/BLwzZx

+0

これは、すべての問題があれば良いではないが画像bおよび画像cの高さが画像aの高さよりも大きい場合、エンティエ行はセカンド列の高さをとる。行は**常に**イメージの高さである最初の列の高さでなければなりません。 2番目の列の画像は、このサイズに合わせて高さを調整する必要があります。 –

関連する問題