浮动的Divs服从/不服从垂直对齐

在垂直对齐的表格单元格中:底部,我有一个或两个div.每个div都是浮动的.
据说,div不应该与底部对齐,但它们确实(我不明白,但是很好).
但是,当我在单元格中有两个浮动div时,它们将自己对齐到相同的顶行.
我想让第一个较小的div一直坐在底部.另一种可接受的解决方案是使其成为表格单元的全高度.

这很难解释,所以这里是代码:

 

 
  
 
    
 
      
@
 
      
Title Text
Line 2
 
    
 
    
 
      
@
 
      
Title Text
Line 2
Line 3
 
    
 
    
 
      
Title Text
Line 2
 
    
 
    
 
      
Title Text
Line 2
 
    
 
    
 
      
Title Text
Line 2
 
    
 
  
 
  
 
    
 
      
123456789
 
    
 
    
 
      
123456789
 
    
 
    
 
      
123456789
 
    
 
    
 
      
123456789
 
    
 
    
 
      
123456789
 
    
 
  
 
 

以下是问题:

为什么@符号与黄色div位于同一水平？

据说垂直对齐不适用于块元素(如浮动div)1.但确实如此!

如何让@坐在底部或使其成为表格单元格的全高？

我在IE7和FF2中测试.目标支持是IE6/7,FF2/3.

澄清:目标是在表格单元格的底线上显示红色@,在黄色框旁边.在div上使用clear将把它们放在不同的行上.此外,单元格可以有可变的文本行 - 因此,行高不会有帮助.

我发现这篇文章对于理解和排除vertical-align非常有用:

了解vertical-align,或"如何(不)垂直居中内容"