Question

源代码是这样的：

<div id="contact">
                <div class="form">
                    <form action="contact.php" method="post" name="contact-us">
                         <div class="right">
                            <div class="labeled">
                                <label for="text">body</label>
                            </div>
                            <textarea id="text" name="text" cols="20" rows="5"></textarea>
                        </div>
                    </form>
                </div>
            </div>

这是textarea和相关对象的css块：

div.right {
float: right;
margin: 5px 0;
}

div.labeled {
width: 150px;
float: right;
}

div.right div.form textarea#text, textarea#text {
background: #A2A2A2;
border: 1px solid #811D1D;
height: 50px;
margin-right: 20px;
width: 220px;
color: #FFFFFF;
font-family: Tahoma, Geneva, sans-serif;
font-size: 11px;
}

在FF中，所有事情都是正确的，但在IE中，textarea尚未设置样式并保持完整。您也可以在下图中看到差异：

defference between IE and FF

另外正如你可以看到标签标签在FF中设置为true并且在IE中保持完整！我怎么能解决这些问题？

...问候

Answer 1

并非所有版本的IE都支持textarea样式。

在您的代码中，textarea位于正确浮动的div内。好像你要求奇怪的行为。最好浮动“标记”div（或者更确切地说删除div并在标签上做一些诡计）。

Answer 2

http://jsfiddle.net/KzYgt/

overflow: auto; - 滚动条

Answer 3

样式表单元素是一个严重的地狱，因为大多数控件都是由操作系统和浏览器设置的，这些样式很难覆盖，在某些情况下是不可能的。但是，您应该能够实现背景颜色和滚动条消失。

您确定页面上没有ID为“text”的其他元素吗？

可以在此处找到有关css for textarea样式可能性的概述：http://www.456bereastreet.com/lab/styling-form-controls-revisited/text-input-multiple/#ie6-xp

Answer 4

解决！页面标题上只有这个css块：

div.form input[type="submit] {
padding: 2px;
background: #A2A2A2;
border: 1px solid #811D1D;
color: #000000;
height: 20px;
}

如您所见， [type =“submit”] 上有一个丢失的引号。 IE无法纠正代码，但其他浏览器会这样做！这就是问题

P.s：特别感谢@Bakudan介绍jsfiddle Online Editor

...问候

IE与表单css样式不兼容

4 个答案: