html - IE7 : an excessive margin in form for textarea

Question

我正在尝试处理我的应用程序中的 IE7 错误。这是 HTML/CSS 代码

<div style="margin-left: 320px">
    <form method="post" action=""><fieldset>
        <textarea name="prj_comment" id="prj_comment" rows="5" cols="50" 
                  style="margin: 0; padding: 0"></textarea>
    </fieldset></form>
</div>

在 Firefox/Opera/Webkit/IE6 中是可以的，但在 IE7 中文本区域有 100px 的左边距。如果有人有纠正此问题的提示，非常感谢!

这是显示此示例 HTML 的 IE7 屏幕截图:

http://daneel.net/pub/img/ie7_bug_decalage.jpg

Answer 1

这看起来像是继承的边距错误(类似于但不同于 float 的双边距错误)。 textarea 继承了表单周围 div 的边距。 Position Is Everything describes it in more detail .

实际的解决方法是:

• 为文本区域提供 -320 像素的负左边距(显然仅适用于 IE)。
• 在文本区域之前放置一个内联元素，但在字段集中。貌似可以设置样式为display:none，但是元素不能为空。
• 将文本区域包装在 div/span/any-other-tag 中，只要它没有任何样式规则来为其布局(我实际上认为表单或字段集会修复它，但显然他们没有't).