Question

我在我正在建设的网站的联系我们页面上创建了一个联系表单。 Mac浏览器正确渲染它，Windows上的IE7和IE8也是如此。

FF，Chrome和Safari在Windows平台上存在间距问题。我的代码列在下面;

<form action="" method="post">
    <fieldset id="fs1">
        <div id="formLeftCol">
            <ol>
                <li>
                    <label for="name">Your Name*</label> 
                </li>
                <li>
                    <input id="name" name="name" type="text" />
                </li>
                <li>
                    <label for="email">E-mail*</label>
                </li>
                <li> 
                    <input id="email" name="email" type="text" />
                </li>
                <li>
                    <label for="website">Website</label> 
                </li>
                <li>
                    <input id="website" name="website" type="text" />
                </li>
                <li>
                    <input type="submit"name="submit" value="SUBMIT" />
                </li>
            </ol>
        </div>
        <div id="formRightCol">
            <ol>
                <li>
                    <label>Your Message*</label> 
                </li>
                <li>
                    <textarea name="message" cols="40" rows="7">
                        Please leave us a message...
                    </textarea>
                </li>
            </ol>
        </div>
    </fieldset>
</form>

现在的CSS：

#formLeftCol, #formRightCol {
    float: left;
}
#formLeftCol {
    width: 150px;
}
#formRightCol {
    width: 473px;
    margin-left: 15px;
}
input, textarea {
    background: #f9f9f9;
    border: 1px solid #c1c1c1;
    font-family: Helvetica, Arial, sans-serif;
    color: #818181;
    margin: 10px 0;
    padding: 10px;
}
fieldset {
    padding: 15px;
} 
textarea {
    width: 451px;
}
#fs1 {
    border: 1px solid #c1c1c1;
}

textarea不会相应地自行调整，它在这些浏览器上太宽，但是其他每个浏览器都有效。

由于

Answer 1

你的问题肯定在CSS中。我不确定你在OSX上发生了什么，但我在Windows（IE，FF，Chrome）上的一堆浏览器中看到了这个问题。

尝试通过CSS指定输入的宽度：

input {
    width:141px;
}

这似乎给了我想象你想要的效果：http://jsfiddle.net/P5jkJ/1/

为什么我的联系表单在Windows浏览器上呈现不正确？

1 个答案: