Question

我有两个div，或者＆＃34; panel＆＃34;。一个面板不包含图像，因此它不能与具有图像的面板正确缩放。

以下是一个正在发生的事情的例子。

http://www.bootply.com/TpbX2VOh0v

有人可以帮我制作底部面板比例与顶部面板相同的尺寸，同时保持文字水平和垂直居中吗？

Answer 1

使用Javascript，您可以通过使两个DIV的高度相同来监听调整大小事件。

$("#panel-1").resize(function(event) {
    setSizes();
});
$("#panel-4").resize(function(event) {
    setSizes();
});

function setSizes() {
    var height1 = $("#panel-1").height(),
    var height2 = $("#panel-4").height(),
    var finalHeight = height1;

    if(finalHeight < height2) {
        finalHeight = height2;
    }

    if(height1 !== height2) {
        $("#panel-1").css("height", finalHeight);
        $("#panel-4").css("height", finalHeight);
    }
}

这样的事情应该可以解决问题。你也可以不用jQuery来做。你只需要查找原始的Javascript调用。

Answer 2

您只是不指定高度或宽度，只需插入内容并将div放入div中。

如何使div与另一个div的大小相同，同时保持它的文本垂直居中？

2 个答案: