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和2”与“Box 3”的高度相等。我使用Equal Heights插件，这将跟踪我最高的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);

基本上这里发生的是你正在为你的div设置一个类盒子（对我而言，“盒子”是我用于所有盒子div的东西。然后我看看并知道最小高度是什么并将其设置为那个.Wallah！等高的盒子。

希望这有帮助。

getskeleton - 响应列对齐到底部

1 个答案: