如何让文本留在td ALWAYS的左上角？

Question

如果第二个div/span中的文本足够长,则第一个div/span保持在上角.但如果第二个div/span中没有任何内容,则第一个div/span位于td的中间.

我正在使用IE 8.

日历的HTML代码段

<table id="calendar">
    <thead>
        <tr><th>April</th></tr>
        <tr>
            <th>Sun</th>
            <th>Mon</th>
            <th>Tues</th>
            <th>Wed</th>
            <th>Thur</th>
            <th>Fri</th>
            <th>Sat</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <div>
                    <span>1</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
            <td>
                <div>
                    <span>2</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
            <td>
                <div>
                    <span>3</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
            <td>
                <div>
                    <span>4</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
            <td>
                <div>
                    <span>5</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
            <td>
                <div>
                    <span>6</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
            <td>
                <div>
                    <span>7</span>
                </div>
                <div>
                    <span></span>
                </div>
            </td>
        </tr>
    </tbody>
</table>

日历的CSS

#calendar {
    border:2px solid black;
    height:100%;
    width:100%;
}

#calendar td {
    border:2px solid black;
}

#calendar td > div:first-child {
    text-align:left; 
    left: 0; 
    top: 0;
}

#calendar td > div:first-child > span{
    text-align:left; 
    left: 0; 
    top: 0;
}

#calendar td > div + div {
    clear:both;
    text-align:center;    
    font-weight:bold;
    white-space:normal;
}

Answer 1

vertical-align:top 会做的.