Question

请参考我附上的图片以便更好地理解，可能是我的问题可以通过CSS调整，请帮忙

此致

http://i.stack.imgur.com/710hT.png

Answer 1

这是一个简单的问题。发生这种情况的原因是图片的高度不均匀。尝试给div的min-height。

例如：.somediv{ min-height: 200px;}

推荐如果要动态设置高度，请使用简单的javascript。

 equalheight = function(container) {

        var currentTallest = 0,
            currentRowStart = 0,
            rowDivs = new Array(),
            $el,
            topPosition = 0;
        $(container).each(function() {

            $el = $(this);
            $($el).height('auto')
            topPostion = $el.position().top;

            if (currentRowStart != topPostion) {
                for (currentDiv = 0; currentDiv < rowDivs.length; currentDiv++) {
                    rowDivs[currentDiv].height(currentTallest);
                }
                rowDivs.length = 0; // empty the array
                currentRowStart = topPostion;
                currentTallest = $el.height();
                rowDivs.push($el);
            } else {
                rowDivs.push($el);
                currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest);
            }
            for (currentDiv = 0; currentDiv < rowDivs.length; currentDiv++) {
                rowDivs[currentDiv].height(currentTallest);
            }
        });
    }
    $(window).resize(function() {   //to work in resize
        equalheight('.somediv');
    });

    $(document).ready(function() {
     equalheight('.somediv');
    });

此代码将为所有div提供相同的高度并使图像保持良好对齐

如何修复图像列表中剩余的空间

1 个答案: