CSS显示:表格和显示:固定宽度的表格单元格替代

时间:2014-04-27 12:21:47

标签: css css3

我以为我发现了一些非常棒的显示器:table和display:table-cell属性,用于使导航更具响应性和流畅性,display:table应用于ul-table-layout:固定;并且li给出了显示:table-cell所有添加的线条完全适合ul,无论边框或任何其他添加的元素(不同于基于百分比的宽度),不需要浮动,并且可以像IE8一样工作使最小的跨浏览器兼容性样式。

但不幸的是,Firefox确定某个位置无法应用于显示为表格单元格的元素,这意味着所讨论的元素不能是另一个元素的父级,而是说...绝对定位。最终意味着Firefox将居中并浮动您的二级导航垂直连接到body标签,或者背景中具有正确位置的其他东西。 (有点滑稽,这可以追溯到IE8,但不是Firefox)。

无论如何,我离题了。

有没有人找到一种合适的替代方法,不使用基于百分比的宽度来解决这个问题?

提前干杯。

1 个答案:

答案 0 :(得分:1)

对于FF绝对定位,当您想要在屏幕区域中查看元素时,可能不需要重置特定left坐标,也不需要重置top坐标。

请参阅 this example ,其中topleft留给auto

我添加了box-shadow,因此您可以看到每个元素ulli的位置。

然后,您可以决定处理paddingmargin来代替协调。