css - 使用 html 中的 span 属性保持值固定

Question

这是我的跨度元素：

<span style="padding-right:20px">Reference No.<?php echo $ref_number; ?></span>

我要参考号。文本保持固定。但根据来自 db 的值的长度，文本会左右移动。我如何解决它？

Answer 1

尝试这样的事情：调整跨度的宽度number以固定label跨度：

HTML：

<span class="label">Reference No.</span>
<span class="number"><?php echo $ref_number; ?></span>

CSS：

span.number {
    display: inline-block;
    width: 140px; // maximum reference width
}

见 jsfiddle