html - Align a <div> to the top, and one to the bottom of a table -

I'm having trouble with some vertical CSS positioning I would like to create a page with the following layout:

< B> AA AAA AAA C AAA

A grid of data is a table B is aligned under the grid c above the grid C

How do I align B and C correctly?

Edit: div / table tag! I am trying to do this with ideal CSS, but if it is a lot of work then I will use a table to settle for Dittendhole's solution.

I have just tested (adds to the wrapper divis):

 < Code> & lt ;! DOCTYPE html public "- // W3C // DTD XHTML 1.0 Transcriptional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> & Lt; Html xmlns = "http://www.w3.org/1999/xhtml" & gt; & Lt; Top & gt; & Lt; Style type = "text / css" media = "screen" & gt; #wrapper {Status: Relative; } #b, # c {status: absolute; Left: 0; Width: 80px; Background: #ccc; } # A {margin-left: 80px; } #b {top: 0; } # C {bottom: 0; } & Lt; / Style & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Div id = "wrapper" & gt; & Lt; Div id = "b" & gt; B & lt; / Div & gt; & Lt; Table range = "0" id = "A" & gt; & Lt; TR & gt; & Lt; Th & gt; Header & lt; / Th & gt; & Lt; Th & gt; Header & lt; / Th & gt; & Lt; Th & gt; Header & lt; / Th & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; TD & gt; Data & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt; & Lt; Div id = "c" & gt; C & lt; / Div & gt; Content of & Lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt;  

Divs C and B should be given a fixed width, and at all position the cover provides a relative position to create this task. A margin equal to the width of the table A is given; B

I did not test cross-browser, just firefox 3