3

我有这样的横向新闻： DEMO

如果你在 Firefox 中运行这个小提琴，它在其他浏览器中的显示会有所不同。在我的网页上，它定位随机位置（始终相同）。

我必须使用position: absolute;，因为我想在所有列中将日期和按钮保持在同一级别。

我用谷歌搜索，但所有解决方案都不适合我。

所以我的问题是如何定位到看起来像DEMO。

4

3 回答 3

8

看起来像：http ://bugzil.la/203225

它是在 10 多年前记录的。

作为一种解决方法，您可以在 TD 中使用 div 并将其设置为 position:relative 而不是直接在 TD 上设置。

于 2013-11-11T22:36:41.927 回答
2

对我来说，您似乎在 Firefox 中发现了一个与 CSS 表格布局相关的错误。.date具有 class和的绝对定位元素.button应相对于其具有 class 的相对定位父元素的边界放置.col。但它们不在 Firefox 中。

如果您删除该属性display: table-cell;，则日期和按钮将再次相对于其父项放置，但您会丢失所需的表格布局。

避免此问题的一种解决方案是使用浮动布局而不是表格单元：JSFiddle 示例

于 2013-11-11T11:44:20.003 回答
0

试试这个，

.col {
    width: 235px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    vertical-align: top;
    background-color: white;
    display: table-cell;
    position: relative;
    float:left;
}

http://jsfiddle.net/9nn29/3/

于 2013-11-11T11:18:31.767 回答