我在td元素中使用绝对定位的内容时发现了一个问题.该td元素未被识别为定位元素,因此内容相对于该元素定位body.此问题仅出现在FireFox中,并且预期的布局在其他浏览器中可见 - jsfiddle.
对它进行一些挖掘似乎与使用FireFox display:table-cell作为表格单元格的默认显示类型有关.我可以通过将显示更改为block或通过添加div容器来充当内容的定位容器来解决此问题.
有没有理由避免将单元格的显示类型更改为block？我更愿意使用此方法,而不是添加其他元素来纠正一个浏览器中的问题.
这与表格单元格中div样式绝对描述的问题不同,或者为什么"position:absolute"时"display:table-cell"被破坏.
Bor*_*sky 11
如果将单元格的显示设置为block它将包含在匿名表格单元格中.生成的CSS框树与<div>在单元格内部创建内容并在该块上设置所有单元格的样式和属性相同.
这可能适用于许多目的.如果单元格有一个rowpan或colspan(因为那些在块上没有任何意义),或者如果单元格具有您期望参与边框折叠的边框样式,或者如果您有两个这样的单元格彼此相邻,它将会中断(因为那么两个块将被包装在单个表格单元格,而不是在两个单独的表格单元格).可能还有其他情况会出现意外行为.但是如果你对样式和内容有足够的控制权并且没有对单元格做太多样式,那么这将起作用.