How do I set up three columns like this?

Does anyone know how I would get a page set up like this?

[url]http://i.imgur.com/cxLmGkl.png[/url]

[code]
.pagecontainer {
margin-top:50px;
padding-left:50px;
padding-right:50px;
position:relative;
width:80%;
height:450px;
}
.leftcolumn {
width: 250px;
}
.middlecolumn {
margin-left:250px;
padding-left:25px;
margin-right:300px;
padding-right:25px;
float:left;
display:inline;
}
.verticalimage {
float:right;
display:inline;
width:300px;
}[/code]

[CODE]
<div class=”pagecontainer”>

<div class=”leftcolumn”>text <br> text <br> text</div>

<div class=”middlecolumn”>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet lorem velit. Nullam et metus eget nunc egestas laoreet et quis ligula. Vivamus lobortis sodales pulvinar. Nunc malesuada pretium ornare. Aliquam ut erat at magna pellentesque elementum. Fusce facilisis lorem et tortor euismod bibendum.</div>

<img class=”rightverticalimage” src=”picture1.png”/>

</div>
[/CODE]

I’ve tried various combinations of floats and display types (block, inline-block, etc) but can’t get it to work. The vertical image keeps getting bumped below the middle column of text.

Thanks.

[canned-message]attachments-removed-during-migration[/canned-message]

Also in #CSS _↴