Divs in <td> am oberen Rand von <td> ausrichten

Question

Update: jsfiddle hinzugefügt: http://jsfiddle.net/WgzgF/11/

Ich habe eine Tabelle mit einer Reihe von <td> . Jedes td hat ein div .tdcont die wie ein Wrapper für den gesamten Inhalt dieser td ist. In .tdcont Ich habe 2 Gruppen von divs .alwaystop y .below-at .

<td class="table-td">
   <div class="tdcont">
      <div class="alwaystop">           
         <div class="at1">at1</div>
         <div class="at2">at2</div>
         <div class="at3">at3</div>
      </div>            
      <div class="below-at">
         <div class="bat1">bat1</div>
         <div class="bat2">bat2</div>
         <div class="bat3">bat3</div>
      </div>
   </div>
</td>

Das Problem, das ich habe, ist, dass alwaystop soll sich am oberen Rand der Zelle ausrichten und below-at soll direkt darunter kommen, etwa so

_____________________________________________________
at1 at2 at3       | at1 at2 at3     | at1 at2 at3    |
bat1 bat2 bat3    | bat1 bat2 bat3  | bat1 bat2 bat3 |
small image here  | big image here  |                |
                  | is taking lots  |                |
                  | of space        |                |
__________________|_________________|________________|      

Was ich feststelle, ist, dass alwaystop y below-at sich vertikal zentrieren, wie in dieser Fiedel zu sehen ist http://jsfiddle.net/WgzgF/11/ wenn also eine der benachbarten Zellen in dieser Reihe lang ist, alwaystop zentriert sich selbst auf die Höhe dieser Zeile wie folgt

_____________________________________________________
                  | at1 at2 at3     |                |
                  | bat1 bat2 bat3  |                |
at1 at2 at3       | big image here  | at1 at2 at3    |
bat1 bat2 bat3    | is taking lots  | bat1 bat2 bat3 |
small image here  | of space        |                |
__________________|_________________|________________|      

Was ich tun möchte, ist alwaystop immer vom oberen Rand der Zelle aus beginnen, unabhängig von der Höhe der angrenzenden Zellen, dann wird die below-at fällt darunter. Wie kann ich das tun?

Ich sollte hinzufügen, dass ich den Inhalt von alwaystop nach links verschoben ist, ist auch der Inhalt von below-at Sie sollen also 2 Reihen innerhalb des td sein.

.at1, .at2, .at3{ 
   float:left; 
}
.bat1, .bat2, .bat3{ 
   float:left; 
}

Das css für alwaystop und below-at ist leer. Ich habe eine ganze Reihe von Dingen wie vertical-align und absolute Positionierung versucht, aber nichts hat funktioniert und ich habe einfach aufgegeben und sie gelöscht.

.alwaystop{ 
}
.below-at{
}