34

我正在尝试应用于我display: inline;<legend>元素中的<fieldset>元素,以便以下内容<span>将出现在同一行,但我的 CSS 没有效果。

legend{
    display: inline;
}
span {
    display: inline;
}
<fieldset>
    <legend>Legend</legend>
    <span>Follower</span>
</fieldset>

JSFiddle

编辑

我无法控制 HTML;我只能编辑 CSS

4

2 回答 2

33

传说很特别。特别是,它们的默认渲染无法用 CSS 描述,因此浏览器使用非 CSS 方式来渲染它们。这意味着静态定位的图例将被视为图例,并与字段集的实际内容分开。

怪事不止于此;如果您颠倒跨度和图例的顺序,则图例仍会在大多数浏览器中显示在顶部(但显然不在 Opera 中)。

于 2011-04-28T14:13:46.017 回答
23

Legends 只是不接受display: inlineor display: inline-block,但你可以给它float: left,它会以你想要的方式显示。

于 2015-05-28T17:45:36.827 回答