3 columns layout - ok in ff, safari but not ie

[krko]

hello all,

i have xhtml transitional page which has 3 columns. one on the left, one in the middle and one on the right. the column on the left is 180px, middle is 450px and the right one is 180px as well. basically what i have in css is like this:

.leftcol { float: left; width: 180px; margin: 0 30px 16px 0; }
.middcol { float: left; width: 450px; margin: 0 30px 16px 0; }
.leftlast { float: right; margin: 0; }

and in the page is like this:

<div class="leftcol">
some text...
</div>

<div class="middcol">
some text with some images...
</div>

<div class="leftcol leftlast">
some text...
</div>

it displays ok in all browsers but problem begins when i insert in the middle column an image that's wider than 450 pixels. in ff and safari that image just stretches over the right column (which is just what i want) but in ie, the middle column and the right one, go down, under the left column because that's where there's place for both columns. i don't want this. i want ie to do basically the same thing as ff and safari.

how do i do it?

thank you in advance,
krko

[krko]

anyone?

[supermanjnk]

This is the typical format I use for a 3 column layout
CSS
.right {float:right; width:180px; border:1px solid black;}
.left { float:left; width:180px; border:1px solid black;}
.middle { margin:0 190px; border:1px solid black;}

HTML

<div class="right">
some text...
</div>

<div class="left">
some text...
</div>

<div class="middle">
some text with some images...
</div>