通常< legend>文字很短,所以我不知道这是一个问题,直到我昨天遇到了.我试图在< fieldset>上设置50％的宽度,但是由于长的图例文字,它将无法正常工作.字段集不会小于图例,或者图例的宽度超过字段集的宽度.
这在IE8,Chrome,Safari,Opera等也可能不是问题.这是Firefox,IE6和IE7中的一个问题.
>不设定任何固定宽度
希望没有额外的标记
>没有javascript
>如果上述是不可能的,我们可以这样做
>不放弃使用不同的标签
我看过这篇文章：Getting LEGEND tags to wrap text properly
…但是只有一个答案使用< div>在图例标签内部有一个固定的宽度,我实际上不能让它工作(见小提琴),OP用注释“最终放弃”关闭.搜索这个话题也会有很多“不太多”.
我用一些我试过的CSS来建立一个jsfiddle demo.正如我所说,我从来没有遇到过这样的事情,所以我很困惑,这是非常困难的,我似乎无法做任何工作.真的是不可能吗？
解决方法
添加空格：正常;除了在IE7和IE6之外,传奇作品很好.请看这个
jsfiddle demo
在使用CSS播放一下之后,我通过添加< span>>在IE7,IE8,IE9,FF3-4和Chrome11上工作.在< legend>中与下面的CSS：
legend {
white-space: normal;
width: 100%;
*margin-left: -7px;
}
legend span {
display:block;
width: 100%;
}
请看这个jsfiddle
