我需要使用CSS在列中左对齐和右对齐

Question

我正在尝试创建一个列出成员姓名和日期的网页。这是一个相当长的列表，我把它分成两列。此时，它只是静态使用CSS来创建列，但我需要将列的一部分左对齐（人的名字），并且在列中正确对齐日期。除了实际创建4列之外，我真的不确定如何处理这个问题。在将来的某个时候，我希望让我的页面从XML文档中导入信息，但是那将在未来发展。

CSS：

    div#content
{
    text-indent:3em;
    padding: 10px;
    position:absolute;
    left:225px;
    top:280px;
    float:left;
    width:555px;
    padding-bottom: 1em;

}

.colleft{
   position: relative;
   width: 100%;
   left: 10px;
}

.col1
{
    position: relative;
    overflow: hidden;
    width: 275px;
    float:left;

}

.col2
{
    position: relative;
    overflow: hidden;
    width: 275px;
    float:left;

}

HTML：

        <DIV id="content"> 
        <DIV id="title">
            <H2>
                <B>My List</B>
            </H2>
        </DIV>
        <DIV class="colleft">
            <DIV class="col1">
                <BR>John Q Public   1869,1870,1872*
                John Smith  1871,1872*<BR>
                Johny Appleseed     1873<BR>