[英]How can I make “display: block” work on a <td> in IE?
有什么办法可以让IE显示表格单元格作为实际块吗？
鉴于这种风格：
table,tbody,tr,td,div {
display: block;
border: 1px solid #0f0;
padding: 4px;
}
这个HTML：
<table>
<tbody>
<tr>
<td>R1C1</td>
<td>R1C2</td>
<td>R1C3</td>
</tr>
</tbody>
</table>
<div>
<div>
<div>
<div>R1C1</div>
<div>R1C2</div>
<div>R1C3</div>
</div>
</div>
</div>
该表呈现与Firefox和Safari / Chrome中的嵌套div完全相同。 但在Internet Explorer（8）中，属性display: block无效。 该表呈现的方式与我没有设置该属性完全相同。
我的主要问题是细胞不会破裂; 它们全部呈现在一条线上。 （ tbody和tr元素没有任何边框也没有填充。不过，这对我来说不是问题。）
我在搜索时没有找到有关该问题的任何信息。 quirksmode和其他地方的兼容性图表表明IE支持display: block from v.5.5 。 关于表显示问题的任何讨论似乎都是在反向时 - 为非表元素提供任何display: table-*属性。
再一次，有什么办法可以让IE渲染表格单元格成块吗？
（真正的表格实际上是一个表格，带有表格数据。我希望保持这种方式，并且不显眼地重复它。）
我申请了float: left的东西 。 它有点工作。
最大的问题是width: 100%与padding相结合使得东西太宽。
这看起来好一点，但我不确定如果你需要它可以在任何地方轻松添加padding 。
这在IE7中失败 - > 悲惨 < - 它只是不会克服它是<table>的事实），即使你不关心IE7，它也需要调整你的用例（如果它可以使用了。
IE7：
以下为IE6 +工作：
tr {
display: block;
position: relative
}
td.col1 {
display: block;
left: 0;
top: 0;
height: 90px;
}
td.col2 {
display: block;
position: absolute;
left: 0;
top: 30px;
}
td.col3 {
display: block;
position: absolute;
left: 0;
top: 60px;
}
假设：
缺点：
top属性的繁琐规范（可能生成） 优点：
何时使用：
刚刚与我的同事一起弄清楚了。
尽管我强烈建议不要在任何时候支持IE8！ 由于您正在促进使用不符合当前标准和技术的不受支持且当前不安全的产品。 告诉用户升级并为他们提供一些浏览器下载链接以供选择会更好。
话虽如此。 下面的CSS是您在Internet Explorer 8中修复它所需的最小css。
table { width: 100%; } td { float: left; width: 100%; }
<table> <tbody> <tr> <td>cell-1</td> <td>cell-2</td> </tr> </tbody> </table>
添加此代码：
<!DOCTYPE html>
我这里是这么解决的，加上上面那条声明语句，显示：块对TD就会有效。
您需要在顶部添加此代码。
<!DOCTYPE html> <html> <head> <style> td { display: block; } </style> </head> <body> <table> <thead> <tr> <td>First Name</td> <td>Last Name</td> <td>Job Title</td> </tr> </thead> <tbody> <tr> <td><div>James</div></td> <td><div>Matman</div></td> <td><div>Chief Sandwich Eater</div></td> </tr> <tr> <td><div>The</div></td> <td><div>Tick</div></td> <td><div>Crimefighter Sorta</div></td> </tr> </tbody> </table> </body> </html>
在顶部添加这行代码，但使用'float'和'width'非常好。 对不起，我的英语太差了。
让它display:table-row; 而不是display:block它会像它应该的那样工作
如何使我的下拉菜单与 display: none 和 display: block 一起使用？
[英]How can I make my dropdown work with display: none and display: block?
如何在IE7中用“display：block”覆盖“display：inline-block”？
[英]How can I override “display:inline-block” with “display: block” in IE7?
我该如何制作一个大小 <td> 与IE中的内在内容相同？
[英]How can I make the size of a <td> be the same as its inner contents in IE?
如何使用'display：block'打开两个跨度
[英]How can i make two spans be in the same line with 'display:block' on
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.