CSS: Two columns equal height, one fixed, the other fluid width

To save others the time and hassle, here’s my lesson learned: don’t try it.  No matter how close you can get with CSS, after almost a day of searching and experimentation, I eventually fell back to this:

http://giveupandusetables.com/

Why?  At some point in time I had the basics working (in all browsers!), but then I tried to add another div centered in the fluid width column, and that became the new seemingly impossible task.  I can only conclude that no clean CSS can evolve from solving this.  Tables will always look right across all browsers (IE6 included), and will be much easier to manage to get the columns right.  It makes centering the div correctly in the fluid column trivial.  Sad how after several hours, I just ended up with this:

HTML:

<table id=container>
  <tr>
    <td id=sidebar>
    </td>
    <td id=content>
    </td>
  </tr>
</table>

CSS:

#container
{
  width: 70%;
  margin-top: 0;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
  padding: 0;
  border-top: 0;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  border-bottom: 0;
}

#container td
{
  vertical-align: top;
  padding: 0;
  margin: 0;
}

#sidebar
{
  width: 180px;
  border-right: 1px solid #ddd;
}