html – 如何在字段集中对齐图例外的文本

概述我想在图例元素之外对齐文本,但我无法找到计算图例宽度的方法. 此示例完全按照我的意愿工作,但它使用硬编码的顶部和左侧尺寸.一旦图例的宽度发生变化,这就会中断.是否有捷径可寻？ (最新的浏览器很好.不需要支持旧版本)： <fieldset> <legend style="border:3px solid red"> Legend legend legend < 我想在图例元素之外对齐文本,但我无法找到计算图例宽度的方法.

此示例完全按照我的意愿工作,但它使用硬编码的顶部和左侧尺寸.一旦图例的宽度发生变化,这就会中断.是否有捷径可寻？ (最新的浏览器很好.不需要支持旧版本)：

<fIEldset>    <legend >        Legend legend legend        <span >Aligned Text</span>    </legend>    text text text</fIEldset>

http://jsfiddle.net/JS6dP/

解决方法 在图例标记中的“图例图例图例”文本周围包裹span标记,另一个位置：绝对span标记和display：inline-block它们.

<fIEldset>    <legend >        <span >Legend legend legend</span>        <span ><span >Aligned Text</span></span>    </legend>    text text text</fIEldset>

DEMO

总结

以上是内存溢出为你收集整理的html – 如何在字段集中对齐图例外的文本全部内容，希望文章能够帮你解决html – 如何在字段集中对齐图例外的文本所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。