Sent by Gunlaug_Sørtun on 8 November 2006 03:03
Mike Saylor wrote:
> I've been trying to work out a 3-col layout without copying someone
> else's. I want to work through this myself.
Sounds reasonable.
Keep the following page bookmarked though...
<http://www.positioniseverything.net/articles/onetruelayout/appendix/equalheightproblems>
....as you'll probably end up with the same problems sooner or later
since you're using the same 'Equal Height Columns' method.
> I've got the layout working in Firefox & Netscape. But the columns
> won't equalize in height in Opera, and in IE it just goes haywire!
>
> Can someone point me in the right direction here? I want to
> understand why it does what it does, not just copy a layout that
> works. If I don't know how it works, how can I modify it?
You're perfectly right :-)
> http://testdomain.ftwin.com
1: Opera 8.x has that problem. Opera 9.x is fine, and 7.54 isn't doing
too bad either. Opera 8.x can be "tricked" if you really, really, need to.
2: IE6 must *not* see 'position: relative' on '.lcontainer',
'.ccontainer' and '.rcontainer', as it will otherwise make the
overflowing parts visible.
Solution: delete 'position: relative' for those floats.
3: IE6 isn't any good at calculating width, so the three floats becomes
too wide - making the rightmost one drop and end up below the real
height of the float in the center in your case.
Solution: make the rightmost float appear narrower than it is, by adding
a negative backside margin on it...
..rcontainer {margin-right: -2%;}
....or another small value.
regards
Georg
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
