2016-04-01 94 views
0

我有這個演示:https://jsfiddle.net/DTcHh/18752/我想圖像的高度是基於右側,使圖像總是去div的結尾。任何建議?如何根據右側拉伸圖像?

<div class="blog_list"> 
    <div class="row"> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <div class="blog_image"> 
       <img src="img/property_img.png" /> 
      </div> 
     </div> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
      <div class="blog_details"> 
       <div class="blog_title">This comfortable apartment is located in the heart of Zurich</div> 
       <div class="blog_posted">POSTED ON: <span>JANUARY 24 2016 14:35h </span>IN <span>KREIS 1</span></div> 
        <p class="blog_more-details"> 
        Wheather a single room studio or multi-room apartment, each has at least one own bathroom and a fully quipped kitches. 
        </p> 
       <div class="sold_by"> 
        <div class="row"> 
         <div class="col-md-12 col-sm-12"> 
          <div class="row"> 
           <div class="col-md-2 col-sm-2 col-xs-12 "> 
            <div class="profile-image"><img src="img/profile.png" /></div> 
         </div> 
        <div class="col-md-10 col-sm-10 col-xs-12 no-padding-left"> 
        <span class="property">ARTICLE WRITEN BY</span> 
        <span class="property_name">Janine Lindenmuller</span> 
        <div class="blog_read_more"> 
        <a href="#">READ MORE</a> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div></div></div></div></div></div> 
+0

哇,有多少的div可以一個用.../offtopic – LinkinTED

回答

0

我認爲ü需要刪除引導電網類必須寫一些自定義的CSS與display:table-cell

例如

.img,.text { 
    display: table-cell; 
    vertical-align: top; 
} 
.img { 
    width:60%; 
} 
.text { 
    width:40%; 
} 

還可以使用低維圖像。小提琴here

0

設置你的圖像的行這樣的:

JSFiddle

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