DIV定位 - 跨浏览器问题

Question

我的页面左边有文字，右边有表格。它在大多数浏览器（包括Firefox，Chrome和Safari）上正常显示（和渲染）。

然而，某些版本的IE会将表单保持在正确的位置（右上角），但会将文本一直推到页面底部。

以下是用于定位表单的代码：

.custom #conversion_form {
width: 300px;
border: 1px solid #999;
background-color: #e9e9e9;
padding: 25px 30px 25px 25px;
float: right;
display: block;
margin-left: 20px;
}

我需要添加哪些标记才能将文字保留在左上方/避免将其推下来？

演示：http://rainleader.com/signup

屏幕截图（它应该如何看）：

Answer 1

我会创建两个div，一个用于表单的另一个文本。

我总是在左侧属性中使用50％的中心，并使用margin-left或marging-right来处理div的de位置，而与分辨率无关。

见这个例子：

Div为文本，将文本放在div中：

.div_left_text {
    position: absolute;
    width: 200px;
    height: 200px;
    left: 50%;
    margin-left:-250px;
    top: 15px;
}

表单的Div，将表单放在此div中：

.div_right_form {
    position: absolute;
    width: 200px;
    height: 200px;
    left: 50%;
    margin-right:250px;
    top: 15px;
}

这应该独立地在左边的另一个中创建两个区域。

Answer 2

当您创建并排效果时，最好将左侧内容向左浮动，向右浮动右侧内容，并overflow:hidden;两者。

如果您仍然发现问题，请将这两个内容包装在<div>和overflow:hidden;中。