我在这个CSS布局中做错了什么？ [英] What did I do wrong in this CSS Layout?

问题描述

我在这里做了这个布局： http://www.2xfun.com/

它使用一些css3效果和东西，在每个浏览器都不支持，但如果他们不工作的罚款。

事情是，我真的试图保持必要的工作在旧浏览器。

我没有使用任何negativ边距，我知道在IE 6等问题

但是如果我看看它在IE 6的布局变得凌乱。元素完全乱码。

我在哪里失败了？我不需要分析我所有的错误，因为我知道它的远非不完美。

所以我的问题是：

ul>

什么属性或属性组合导致此类遗留的不兼容性

有什么好的工作（css重置，javascript修复）？

附录：

这是页面在ie6中的样子

和ŠimeVidas的javascript修复

这是应如何在现代浏览器中显示和显示

解决方案

所有位置：绝对，放置顶部和左侧位置，而不只是顶部。一切有浮动和边距，设置为显示：内联。这将至少修复很多问题。我还建议重置样式，如Meyer的。你的代码看起来有点欠定义为IE6，它是一个挑剔的。

I did this layout here: http://www.2xfun.com/

It uses some css3 effects and stuff which are not supported in every browser, but if they dont work its fine.

The thing is that i really tried to keep the essentials working in old browsers.

I didnt use any negativ margins, which i know of make problems in IE 6 etc

But if i look at it in IE 6 the layout gets messy. The elements are completely garbled.

Where did I fail so terribly? I don't need an analysis of all my errors because i know its by far not perfect. But what positioning css directives are so wrong that they cause IE6 to mess everything up?

So my question is:

• What properties or combination of properties do cause such legacy incompatibility
• are there any good work arounds (css resets, javascript fixes) ?

addendum:

this is how the page looks like in ie6

and after Šime Vidas's javascript fix

and this is how it should look like and looks like in modern browsers

解决方案

Everything that has position: absolute, put both top and left positions, not just top. Everything that has float AND margin, set to display: inline. That will at least fix many problems. I'd also recommend a reset styling, like Meyer's. Your code looks a bit underdefined for IE6, it's a picky one.

这篇关于我在这个CSS布局中做错了什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！