Html 使用CSS在同一行上左右对齐文本

我正在写我的“关于”页面，但遇到了问题。尝试将（年份或待定）与列的右侧对齐。如图所示

上面是它现在的样子。下图是我希望它看起来的样子

---

站点位于

尝试使用span，然后将样式设置为'float:right'

<span style="float:right">pending </span>

挂起

给你

<ul>
    &nbsp;&nbsp;<strong>Golden West College – Huntington Beach, CA <span style="float:right">2012-2014</span></strong><br>
&nbsp; &nbsp; – Associate in Arts Degree – Digital Arts Major <span style="float:right">(pending)</span><br>
<br>&nbsp; Certificate of Achievement<br>
&nbsp; &nbsp; – Graphic Design and Production Option <span style="float:right">(pending)</span><br>
<br>&nbsp; Certificate of Specialization<br>
&nbsp; &nbsp; – Graphic Design Foundation <span style="float:right">6/2014</span><br>
&nbsp; &nbsp; – Graphic Design Advanced Production <span style="float:right">(pending)</span><br>
</ul>

加利福尼亚州亨廷顿海滩金西学院2012-2014

-副学士学位-数字艺术专业（待定）


成就证书

–平面设计和制作选项（待定）


专业证书

——平面设计基金会6/2014版
–平面设计高级制作（待定）

这是一个JSFIDLE

css

html

教育

加利福尼亚州亨廷顿海滩金西学院2012-2014

-副学士学位-数字艺术专业（待定）


成就证书
–平面设计和制作选项（待定）


专业证书
——平面设计基础6/2014

–平面设计高级制作（待定）

OMG，谢谢你。我花了3天时间玩css、div样式、边距等，甚至都没能完成。你的方法简单而中肯。工作得很好。@user3808918此外，请查看它的运行情况。我的示例使用div而不是span，但是很多人比我更快到达这里。^谢谢。css也清理了我这方面的混乱。我有很多不需要的额外代码，因为我到处复制和粘贴了很多。@user3808918请尽量避免内联

style

属性。改用

.class

。@user3808918，你对内联风格有什么看法？一、 就个人而言，内联样式更容易理解，而不必经常引用一些内部/外部.css样式的命令。

ul {
    list-style: none;
}
#about ul li span {
    float: right;
}

<div id="about">
     <h3><strong>Education</strong></h3>

    <ul>
        <li><strong>Golden West College – Huntington Beach, CA <span>2012-2014</span></strong>

        </li>
        <li>– Associate in Arts Degree – Digital Arts Major <span>(pending)</span>
        </li><br/>
        <li>Certificate of Achievement</li>
        <li>– Graphic Design and Production Option <span>(pending)</span>
        </li><br/>
        <li>Certificate of Specialization</li>
        <li>– Graphic Design Foundation <span>6/2014</span>
        </li>
        <li>– Graphic Design Advanced Production <span>(pending)</span>
        </li>
    </ul>
</div>