Tue, 2008-05-13 08:38
hello all,
first i'd like to say i've spent the last afternoon looking for an answer but couldn't find it.
i have a valid 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:
some text...
some text with some images...
some text...
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
Tue, 2008-05-13 08:47
#1
please ignore this comment
please ignore this comment i accidentally wrote it and i couldn't find a way to del it. the question however remains... 
Wed, 2008-05-14 19:28
#2
anyone?
anyone?
Wed, 2008-05-14 20:01
#3
I can't imagine why you
I can't imagine why you would want to force something wider than your set width and expect every browser behaves like you would want them to. Ever thought about that IE interprets your error correct while the rest tries to correct your error and fail?
Fri, 2008-05-16 11:19
#4
it doesn't matter if ie
it doesn't matter if ie interprets my error correctly and other browsers fail or vice versa. it's not a browser contest... i have a problem and i'd like to solve it...
i'm asking this question because i have huge amounts of info to transfer into the new design (from another site) and i don't have time to resize and rearrange the content. there must be a way to make ie display a div over/under another div and z-index doesn't work.
Sat, 2008-05-17 18:09
#5
The problem is that IE≤7
The problem is that IE≤7 has a WAD bug called hasLayout. Once layout is triggered, a container will expand to enclose its content. Period. Full stop. That's what you're bumping into. Modern browsers correctly allow the image to overflow; IE doesn't and won't. It's no help now, but MSFT promises IE8 will not have hasLayout.
Once you're aware of the issue, you tend not to allow over-sized content. If there's a fix, I don't know it off-hand. All I can suggest is that you scale back the image 'til it fits. You could use a conditional comment to feed IE special instructions restricting the width.
cheers,
gary