fixed right sidebar

hi,

I’ve been trying for the past couple of days without any success to work out how to line construct a two column css with the right one of fixed size and the left variable filling out the rest of the page. It should in theory be fairly simple but whenever i test it with data the sidebar drops down so that the two columns arent aligned. I’d appreciate any help. I have the content and sidebar sitting inside the main div (colors were there just so i could see them.

CSS
#main
{background:lightblue; height:700px;}

#content
{background:lightyellow; float:left;}

#sidebar{background:lightgreen;width:320px; height:450px; float:right;}

main index
<div id=”main”>

<div id=”content”> some content some content some content some content some content some content some content some content some content some content some content some content some content
</div>

<div id=”sidebar”> sidebar goes in here
</div>

</div>

Thanks