垂直对齐问题

我想获得一个垂直对齐工作的显示器是表格单元的div。垂直对齐问题

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

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

谢谢。

2012-05-23 Simon R

您定义display:table-cell & position:absolute哪些会产生问题。请删除您的。标题 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-23 10:09:21 sandeep

你应该内div的高度更改为类似30像素，而不是100％ http://jsfiddle.net/Rwahk/4/

来源

2012-05-23 10:05:29 Gijoey

你不应该使用尺寸纯HTML属性（唯一的例外可能是形象，但它仍然是一个坏主意）。

来源

2012-05-23 10:07:49 Malyo

实际上，为图像添加维度属性是加快页面加载速度的好主意。 – BenM

我写这可能会派上用场，对您或其他读者这个小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-23 10:09:52

http://jsfiddle.net/Rwahk/7/作品你想...

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

来源

2012-05-23 10:10:11 Chris

这也适用 - 谢谢你:) –

垂直对齐问题

回答

相关问题