Table and floating div side by side

Hello. I’m having a tricky problem with a CSS design and was wondering if anyone ran into it before.

I have a two column design. The left column has a fixed width and the right column a variable width (auto). To achive this, I have a parent div that contains one div for each of the columns. The left column has the float: left; attribute.

#front-main { overflow: hidden; }
#front-main-sidebar { float: left; margin: 10px; width: 160px; }
#front-main-body { margin: 10px; }

So far so good. However, I’d like to put a table inside front-main-body. It’s a normal table, with several columns and rows and text inside each of those. All of the columns except one have a fixed width in pixels. The remaining column has unspecified width, so it can change freely.

But when I load the page with the table in it, the variable width column has only the minimum necessary width to display its contents in one line. This isn’t the way I want it to behave, though – I want the table to span the entire width of the page except for the width of the sidebar and the margins.

Here are the ways in which I failed to achieve this:
* Setting the table width to 100%, unfortunately, will set its width to the width of front-main, because floating elements are outside the normal flow of the page. Or in other words, even though the content of front-main-body is displayed to the right of front-main-sidebar, front-main-body’s actual width is the same as the width of front-main . So the table becomes too wide and is pushed below the sidebar.
* Adding a margin to the table that’s as wide as the sidebar + its margins does push the table’s left coordinate to its correct position. However, its width still remains the width of front-main, and therefore a large chunk of the table goes out of the browser window and is cut off.
* Floating front-main-body to the right makes it so its width is no longer front-main’s width. Unfortunately, it becomes the minimum necessary width (table-like behavior), so I end up with the same problem, except now the table is aligned to the right, which is even worse.
* After floating front-main-body to the right, setting the table width to 100% again results in a table width the width of front-main, except (in Gecko) it shows below the sidebar and goes slightly outside the browser window to the LEFT, with a portion of the first column being cut off (I have no idea why this happens).

Any ideas?

Also in #CSS _↴