2016-04-20 2 views
-3

Мне нужно, чтобы дочерние div были равны друг другу, как материально долго это вместе со столбцом. У меня только один ряд, остальные останутся столбцами из бутстрапа.Сделать дочерний div равным по строке с помощью jquery

Это скрипка я создал

http://jsfiddle.net/Qr48S/60/

Я уже делаю его равным, но моя проблема заключается в том, что сценарий получает наивысочайший DIV и его применение к другим столбцам, которые делают другие столбцы, имеющие большое белое пространство, когда у него нет такого длинного контента. Мне нужно получить его за строку, хотя я не объявляю более одной строки.

Кнопка также нуждается в нижней части колонны

Похоже, это

<div class="container"> 
    <div class="row"> 
    <div class="item-container col-lg-4 col-md-4 col-sm-4"> 
     <div class="image"><img class="img-responsive" 
     src="http://placehold.it/350x150"></div> 
     <div class="item-title"> 
     title title title title title title title 
     title title title title title title title title title 
     </div> 
     <div class="item-details"> 
     <p>details 1</p> 
     <p>details 2</p> 
     <p>details 3</p> 
     <p>details 4</p> 
     </div> 
     <div class="item-button"> 
     <button type="button" class="btn btn-primary">Add to cart</button> 
     </div> 
     </div> 

     <div class="item-container col-lg-4 col-md-4 col-sm-4"> 
     <div class="image"><img class="img-responsive" 
     src="http://placehold.it/350x150"></div> 
     <div class="item-title"> 
     title title title title title title title 
     title title title title title title title title title 
     title title title title title title title 
     title title title title title title title title title 
     </div> 
     <div class="item-details"> 
     <p>details 1</p> 
     <p>details 2</p> 
     <p>details 3</p> 
     <p>details 4</p> 
     <p>details 1</p> 
     <p>details 2</p> 
     <p>details 3</p> 
     <p>details 4</p> 
     </div> 
     <div class="item-button"> 
     <button type="button" class="btn btn-primary">Add to cart</button> 
     </div> 
     </div> 
    </div> 
</div> 
+1

Желаемого поведение не ясно из скрипки или описания. Чего вы хотите достичь? – RahulB

+0

Я хочу сделать каждый div равным друг другу. От родительского div до childs div –

+0

Вы хотите, чтобы текст «title» не расширялся и оставался до такой же ширины? – RahulB

ответ

0

Моя рекомендация будет использовать высоту матча плагин

Я вставил его в эту вилку вашего jsfiddle

http://jsfiddle.net/n2e4wg76/

Затем вы можете увидеть, что это упростит. Конечно, вместо вставляя весь JS файл, который вы бы включить файл JS из https://github.com/liabru/jquery-match-height

затем просто использовать

$(document).ready(function() { 

    $('.item-container').matchHeight(); 

});