我正在开发一个网络应用程序...不幸的是它必须使用有史以来最糟糕的软件,是的ie6。
我非常喜欢CSS display:table
和display:table-cell
属性,但当然它在ie中不起作用。
有没有人发现任何修复方法?我一直在寻找,但没有找到任何东西
有条件的CSS,.htc文件,javascript ...什么?
我真的想避免使用浮动和清除所有内容
答案 0 :(得分:2)
对不起。没有修复使IE6支持CSS display:table
。在IE6中实现此布局的唯一方法是实际使用<table>
元素。
第一个问题:你真的需要支持IE6吗?如果您可以简单地放弃对它的支持,您将解决自己的大量问题,包括这个问题。目前IE6的全球使用率低于3%,在大多数发达国家甚至更低。
如果你仍然需要支持IE6,那么你最明显的解决方案就是吞下你的语义标记骄傲,只使用<table>
标签。
如@Tom所述,下一个最佳解决方案是使用display:inline-block;
编写布局。
inline-block
允许您将元素定义为块,但仍将它们保留在文本流中(有点像<img>
标记默认工作的方式)。如果将它与固定元素宽度和wapper divs组合在一起,你可以实现与表类似的东西,尽管可能很难让它随页面宽度动态扩展。
围绕这个问题的一个重大问题是,inline-block
仅适用于IE6 / 7中具有默认样式display:inline
的元素。换句话说,它适用于<span>
但不适用于<div>
。不是灾难,而是需要注意的事情,特别是因为你特别询问IE6的支持。除此之外,好消息是你应该能够在没有任何其他黑客或解决方法的情况下使用display:inline-block
。
答案 1 :(得分:0)
IE不支持display:table和display:table-cell但IE7及以下版本支持display:inline-block。实现这项工作的常用方法是执行以下操作:
display:-moz-inline-stack;
display:inline-block;
zoom:1;
*display:inline;
请记住,CSS为您提供了很多定位能力,并给出了您希望布局看起来如何的背景,我可以为您提供更好的解决方案。
由于误解,让我澄清上面的代码。 显示:-moz-直列堆叠;是为旧版本的Firefox声明的。 缩放:1; IE有一个名为hasLayout的属性,这是一种触发它的方法。 * display:inline被称为*属性hack,用于隐藏所有非IE 浏览器中的这一行
缩放:1和*显示:内联有效地允许块级元素的行为类似于内联元素(以便内联块可以在IE6 +中工作)
欲了解更多信息,请阅读: