3

我希望包含内容的字段集和 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/

4

2 回答 2

7

在HTML5 样板 legend的 CSS 文件上以这种方式设置样式

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

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

于 2012-05-21T13:16:33.100 回答
0

尝试这个

fieldset , legend{ padding:0px; margin:0px;}
于 2012-05-21T13:16:56.347 回答