html - 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，一个用于文本，另一个用于表单。

我总是在 left 属性上使用 center 50%，并使用 margin-left 或 marging-right 来独立于分辨率处理 div 的位置。

看这个例子:

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;
}

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