Html 表单在IE7中的位置不正确

在这个网站上，我使用css3的框阴影和rgba作为内容背景。为了更好地使用IE7，我使用了3张图片。表单元素在主内容区域下方被清除，它应该位于主内容区域的右侧

有人知道为什么吗？

你的HTML不是。首先尝试解决这个问题，它可能不会解决问题，但至少你会有一个良好的工作基础

在尝试修复呈现问题和怪癖之前，拥有有效的HTML/CSS是最基本的，因为并非所有浏览器都以相同的方式处理无效标记。

您的HTML不是。首先尝试解决这个问题，它可能不会解决问题，但至少你会有一个良好的工作基础

---

在尝试修复呈现问题和怪癖之前，拥有有效的HTML/CSS是最基本的，因为并非所有浏览器都以相同的方式处理无效标记。

现在我没有接触你的main2.CSS。仍然使用

float:right

为FF/Chrome/Safari布局表单。我的解决方案使用

position:absolute

在ie.css中布局表单

我认为这是为IE7+修复网页的最简单/最快捷的方法

就我个人而言，我会回去重构main2.css以获得更高的代码一致性，你可能会以ie.css的方式得到更少的代码（这是我通常努力的目标）

我使用绝对定位，因为我知道它会起作用。你也可以使用相对定位。使用浮动定位是很棘手的。我发现在某些情况下使用相对/绝对更容易实现跨浏览器兼容性，但我可能错了。我相信还有其他方法可以剥这只猫的皮，也许更好

如果您需要任何其他提示或建议，或者如果下面的步骤不能100%适用于您，请告诉我。顺便说一句，你的网站看起来棒极了

从最新版本的index2.php、main2.css和ie.css开始：

在index2.php中

将

移动到：

div#容器

ie.css中的

摆脱：

#表单{float:right；}

摆脱：

#容器#底部{清除：左；}

加：

#容器#内容{float:none；}

更改：

#容器#底部{margin:0；}

致：

#容器#底部{margin:035px；}

加：

#container{position:relative；}/*这将设置下一行的父元素*/

最后加上：

#形式{位置：绝对；右侧：0；顶部：-15px；}

---

如您所知，您仍然需要将图形添加回

div#表单

，并将顶部和底部圆形图形放回

div#表单

。如果你有任何问题，需要帮助，让我知道。希望有关的技术能帮助您完成它。

现在我没有碰您的main2.css。仍然使用

float:right

为FF/Chrome/Safari布局表单。我的解决方案使用

position:absolute

在ie.css中布局表单

我认为这是为IE7+修复网页的最简单/最快捷的方法

就我个人而言，我会回去重构main2.css以获得更高的代码一致性，你可能会以ie.css的方式得到更少的代码（这是我通常努力的目标）

我使用绝对定位，因为我知道它会起作用。你也可以使用相对定位。使用浮动定位是很棘手的。我发现在某些情况下使用相对/绝对更容易实现跨浏览器兼容性，但我可能错了。我相信还有其他方法可以剥这只猫的皮，也许更好

如果您需要任何其他提示或建议，或者如果下面的步骤不能100%适用于您，请告诉我。顺便说一句，你的网站看起来棒极了

从最新版本的index2.php、main2.css和ie.css开始：

在index2.php中

将

移动到：

div#容器

ie.css中的

摆脱：

#表单{float:right；}

摆脱：

#容器#底部{清除：左；}

加：

#容器#内容{float:none；}

更改：

#容器#底部{margin:0；}

致：

#容器#底部{margin:035px；}

加：

#container{position:relative；}/*这将设置下一行的父元素*/

最后加上：

#形式{位置：绝对；右侧：0；顶部：-15px；}

---

如您所知，您仍然需要将图形添加回

div#表单

，并将顶部和底部圆形图形放回

div#表单

。如果你有任何问题，需要帮助，让我知道。希望有关的技术可以帮助您完成。在我的IE7上，一切都显示正常，如果您解决了问题，您可以发布解决方案。

在我的IE7上，一切都显示正常，如果您解决了问题，您可以发布解决方案。

div表单在您的div容器之外

试试这个：

• 将div#form放在div#content之后的容器内
• 设置div#form float:右；而不是左
• 调整div#content和div#form width/padding/margins，以便两者都适合div#容器的宽度
div形式在div容器外
试试这个：
• 将div#form放在div#content之后的容器内
• 设置div#form float:右；而不是左
• 调整div#content和div#form width/padding/margins，以便两者都适合div#容器的宽度

---

如果你想了解为什么会发生这种情况