getskeleton - 반응 형 컬럼이 바닥에 정렬

Question

여기에 도전입니다! 나는 순간에 GetSkeleton을 사용하고 3 기본 열

<div class="container"> 
    <div class="one-third column box1"> 
    Some text<br/> 
    </div> 
    <div class="one-third column box2"> 
    Some text 
    </div> 
    <div class="one-third column box3"> 
    Some text<br/> 
    Some text<br/> 
    Some text<br/> 
    Some text<br/> 
    </div> 
</div> 

당신이 알 때, 상자 3 에서 더 많은 콘텐츠가이 있어요

은 내가 어떻게 할 수 그것은 그 상자 1 상자 2 그래서 반응성을 유지하는 것과 관련하여

Answer 1

당신이 이것에 대한 해결책을 찾았고 "Box1 and 2"가 "Box 3"과 동일한 높이가 되길 원한다고 가정 할 때 확실하지 않습니다. Equal Heights Plugin을 사용하여 가장 큰 div를 추적하고 이 그것을 호출 한 후

을 그리고,

(function($) { 
$.fn.equalHeights = function(minHeight, maxHeight) { 
    tallest = (minHeight) ? minHeight : 0; 
    this.each(function() { 
     if($(this).height() > tallest) { 
      tallest = $(this).height(); 
     } 
    }); 
    if((maxHeight) && tallest > maxHeight) tallest = maxHeight; 
    return this.each(function() { 
     $(this).height(tallest).css("overflow","auto"); 
    }); 
} 

}) (jQuery를) :

$(".box").equalHeights(250); 

0123. 그것이 여기에 다음 그에 따라 그것을

을 사람의 크기를 조정

기본적으로 여기서 일어나는 일은 div에 클래스 상자를 설정하는 것입니다 (저의 경우 "상자"는 모든 box div에 사용하는 것입니다. 그런 다음에 최소 높이가 무엇인지보고보고 설정합니다. 와라! 동일한 높이 상자.

희망이 도움이됩니다.