css 文字两端对齐

制作封面、表格时，会有 这种标签格式，一般有2~4字不等，需要两边对齐。经测试仅仅text-align: justify; 和 display: inline-block; 没有效果。

效果图IE7（IE8均可以）：

chrome效果图：

html：

<ul class="examined_info">
    <li><span class="examined_label">登 记 号：<span>span>span><span class="examined_text">T005span>li>
    <li><span class="examined_label">姓  名：<span>span>span><span class="examined_text">左**span>li>
    <li><span class="examined_label">性  别：<span>span>span><span class="examined_text">左**span>li>
    <li><span class="examined_label">年  龄：<span>span>span><span class="examined_text">左**span>li>
    <li><span class="examined_label">身份证号：<span>span>span><span class="examined_text">左**span>li>
    <li><span class="examined_label">单  位：<span>span>span><span class="examined_text">左**span>li>
    <li><span class="examined_label">日  期：<span>span>span><span class="examined_text">左**span>li>
            ul>

css：

.examined_info li {
    list-style-type: none;
    height: 28px;
}
.examined_text {
    text-decoration: underline;
}
.examined_label {
    text-align: justify;
    display: inline-block;
    width: 80px;
    height: 30px;
    vertical-align: top;
}
.examined_label>span {
    display: inline-block;
    padding-left: 100%;
}

核心代码：

<span class="examined_label">登 记 号：<span>span>span>

需要在外层span中加通用的text-align: justify; 和 display: inline-block;，内层加span，同时要加上如上.examined_label>span 的样式。

另外，只加上这两句，这个label会很高，所以需要加高度以控制和下一行的距离。

附：
在调试中遇到的问题：
1.最开始没有在“登 记 号：”这个几个字中间加空格也没有加&emsp 这类占位符，chrome上有效果：

但在IE8上没有效果：

2.后来，在无论两个字还是三个字时都加上空格，chrome上效果和上面没有加空格一样，但实际上文字还是不算两端对齐；
而在IE8上却正常了：

最后，修改为如上代码，两端对齐和占位符根据字数配合使用。
或者不要把冒号放在label中，应该也可以，这样应是最简洁的方式。

核心解决方案参考：
https://www.cnblogs.com/lzkwin/archive/2012/11/08/2761667.html