html - 将 .panel 与 FIELDSET 和 .panel-heading 与 LEGEND 组合时的设计问题

Question

出于可访问性原因，我需要将 fieldset 和 legend 添加到 Bootstrap 的 .panel 元素。但遗憾的是，legend 无法再正确设置样式:fieldset 周围的边框只能达到中间高度!

代码笔:http://codepen.io/jmuheim/pen/ByMVwY

有谁知道如何使 fieldset.panel-heading 看起来与 div.panel-heading 完全一样？

Answer 1

您可以在 legend 标签中添加 float left。由于宽度已设置为 100%，因此应该不会引起任何问题

http://codepen.io/anon/pen/LEqrBR

legend.panel-heading {
    font-size: 14px;
    margin-bottom: 0;
    float: left;
}

我在 FF 和 Mac 上的 Chrome 上检查过这个，看起来不错。要使正文部分的间距正确，您可以向 legend 标记添加边距。例如

margin-bottom: 10px;

http://codepen.io/anon/pen/dPaKgv