0

我试图让一个垂直对齐在显示为表格单元格的 div 上工作。

有关 html/css，请参阅http://jsfiddle.net/midnitesonnet/Rwahk/。

我似乎无法让显示垂直对齐到底部。任何帮助将非常感激。

谢谢。

4

5 回答 5

1

您定义display:table-cell&position:absolute会产生问题。只需删除您的.title DIV height。

#whats_available .title {
    position: absolute;
    z-index: 1000;
    bottom: 0;
    left: 0;
    text-align: center !important;
    width: 100%;
    color: #fff;
}

检查这个http://jsfiddle.net/Rwahk/5/

于 2012-05-23T10:09:21.410 回答
1

http://jsfiddle.net/Rwahk/7/按您的意愿工作...

所做的更改是添加display: table;到#whats_available > div和更改.title为position: relative;

于 2012-05-23T10:10:11.553 回答
0

您应该将内部 div 的高度更改为 30px 而不是 100% http://jsfiddle.net/Rwahk/4/

于 2012-05-23T10:05:29.640 回答
0

您不应该在纯 html 中使用尺寸属性（唯一的例外可能是图像，但这仍然是一个坏主意）。

于 2012-05-23T10:07:49.320 回答
0

我编写了这个小 jQuery 函数，它可能对您或其他读者有用。

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
    this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
    return this;
}

采用：

$(selector).center();

享受并度过美好的一天:)

于 2012-05-23T10:09:52.510 回答