Floated sidebar pushed below another div

I am trying to design my first custom (not kind of modified/hacked together) theme. I am using Starkers as my starting point. In the middle of the page, I have a div (cnt-mid-inner) which contains two other divs, cntin-cnt and cntin-side. cntin-cnt contains all the posts and stuff and cntin-side contains the sidebar. I want the sidebar to be at the right and the posts to be next to it on the left. The problem is that the floated sidebar is below the posts. In other words, all the positioning is right, except that the sidebar is too low on the page. Here is a picture of what I am talking about:

http://img132.imageshack.us/my.php?image=testsiteld7.png

(sidebar is in red, posts are in yellow)

Here is the css for the divs I mentioned and the footer:

/* cnt-mid-inner - main content holder */
#cnt-mid-inner{
border: 1px solid black; /* debug */
}

/* cntin-cnt - posts */
#cntin-cnt{
background: yellow;
margin-right: 200px;
}

/* cntin-side - sidebar */
#cntin-side{
background: red;
float: right;
width: 200px;
}

/* cnt-btm-footer - footer below cnt-mid-inner (main content) */
#cnt-btm-footer{
border: 1px solid black; /* debug */
clear: both;
}

Thanks!