table-like divs [Resolved]

[ober0330]

I want to know if this is even possible:

I have an internal site setup with tables right now. It has a left-side navigation menu with a larger content area on the right.

The setup works great in all browsers. The problem is, I want to give them the ability of hiding the menu. This would be easy with a div, because I could just set the style display property to none with Javascript.

But since I'm using tables, it doesn't give me the ability to do that.

My problem with divs is that I can't get the concept of "set width for left and the right side fills the remainder. Plus there are all sorts of issues to get this to play correctly in all the browsers.

So I guess my question is, is there a way to create something like what I want using something other than a table that reacts nicely to the CSS display attribute?

I hope that was clear enough. Any guidance would be greatly appreciated.

And I have made a quick attempt, with bad results:

.navigate {
	background-color: Gray;
	border: 0px;
	margin: 0px;
	padding: 0px;
	width: 140px;
	display: inline;
	height: 200px;
}

.content {
	margin: 0px;
	border: 0px;
	padding: 0px;
	background-color: Teal;
	display: inline;
	height: 200px;
}