html – IE8拉伸表格单元格高度

html – IE8拉伸表格单元格高度,第1张

概述我有一个基于表格的页面布局,并且我想用更现代的标记重新构建它,这不是一个选项.布局使用跨越两行的单元格作为右侧的侧边栏,而左上角的单元格包含一个简单的标题,左下方的单元格包含页面的主要内容.左上角的单元格具有固定的高度,并且未指定底部单元格和右侧单元格的高度.我创建了一个简化示例来说明我的问题: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" " 我有一个基于表格的页面布局,并且我想用更现代的标记重新构建它,这不是一个选项.布局使用跨越两行的单元格作为右侧的侧边栏,而左上角的单元格包含一个简单的标题,左下方的单元格包含页面的主要内容.左上角的单元格具有固定的高度,并且未指定底部单元格和右侧单元格的高度.我创建了一个简化示例来说明我的问题:
<!DOCTYPE HTML PUBliC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/HTML4/strict.dtd"><HTML><head><style type="text/CSS">.fixed { height: 100px; }table { border: 1px solID #000; }td { border: 1px solID #ddd; vertical-align: top; }tr { border: 1px solID #cfc; }* { padding: 15px; }</style></head><body><table><tr ><td>left</td><td rowspan="2"><div >right</div></td></tr><tr ><td>left</td></tr><tr ><td colspan="2">footer</td></tr></table></body></HTML>

我已将右列的高度设置为500px,以模拟高于左侧两列高度的内容.这在现代浏览器中的表现如预期:左上角单元格的高度保持固定,下方单元格拉伸以填充额外空间.但是在ie8中,两个左侧细胞都是垂直拉伸的.我需要顶部单元格来保持其固定高度.如何让ie8仅使用CSS来表示为左上角单元格指定的高度?

编辑:
我没有在右列td上设置高度,而是在右列内的div上设置高度.

解决方法 我认为Jeroen是正确的,没有纯CSS解决方案来解决这个问题.任何时候在设置了rowspan的表中都有单元格,IE将忽略在这些行上设置的任何显式高度.解决方案是永远不要使用rowspan.在我的情况下,我能够通过在第二行中放置跨越两行的内容,将第一行中的单元格留空,并使用负边距将内容的开头移动到第一行来绕过问题.我希望这对其他人有帮助.如果有人确实有一个纯CSS解决方案,我会接受这个答案. 总结

以上是内存溢出为你收集整理的html – IE8拉伸表格单元格高度全部内容,希望文章能够帮你解决html – IE8拉伸表格单元格高度所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1139219.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-31
下一篇2022-05-31

发表评论

登录后才能评论

评论列表(0条)

    保存