如何让文字留在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会做的伎俩。

Answer 2

试试这个

div { 
    height: 14px; 
    margin-top: -4px; 
}