从图例元素中删除左边距

Question

我希望包含内容的fieldsets和div在视觉上相等。我使用YUI 3.4.1重置CSS，我有以下标记：

<fieldset>
    <legend>Hello world!</legend>
    <div>Lorem ipsum</div>                
</fieldset>
<div>
    <h3>Hello world!</h3>
    <div>Lorem ipsum</div>                
</div>

在IE7中，它略微缩进了图例元素。我试图删除填充，边距和文本缩进。

fieldset,div{ 
    background-color: red;
    width: 200px;
    padding: 0;
    text-indent: 0;
    margin: 0;
}
legend,h3{ 
    background-color: yellow; 
    width: 200px; 
    display: block;
    padding: 0;
    text-indent: 0;
    margin: 0;
}

我在这里缺少其他属性，这有助于解决问题吗？

http://jsfiddle.net/DBhQb/

Answer 1

HTML5 boilerplate legend的CSS文件以这种方式设置

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

*margin-left: -7px;应该成功，因为它是IE的一个css hack＆lt; 8

Answer 2

试试这个

fieldset , legend{ padding:0px; margin:0px;}