CSS - IE6 vs everything else issue

CSS - IE6 vs everything else issue

Posted by: crimsondryad
Posted on: 2006-08-15 07:53:00

I've been beating my head against the wall with this for hours. Tried just about everything I can think of. Can someone please have a look? The url is http://stevemoore.crimsondryad.com

The issue? In IE7 & Firefox, the right content div is positioned perfectly (the one with the gray border I added to see the edges). In IE6 it's all wonky and rides over the text on the left.

I've tried margins, padding, moving the left value, moving the right value, kicking the damn computer, you name it.

Any advice would be well appreciated.

================================
Angela Gann
CrimsonDryad Web Design Services
Web Design, Custom Software Development
http://www.crimsondryad.com

Re: CSS - IE6 vs everything else issue

Posted by: Atropos7
Posted on: 2006-08-15 10:12:00

At the moment it looks like you tried wrapping everything in a table and because of that its broken in Firefox. It's broken because you didn't specify the width of the table. In order for floats to work, you have to have enough room in the containing block. The problem is that IE has a different idea of how to calculate that room, so it can be tricky at times.

You probably want a two column layout. You need:

<div class="container">
<div id="rightcolumn" style="float: right">
Stuff in the right goes here
</div>
<div id="leftcolumn" style="float: left">
Stuff in the left goes here
</div>
</div>



cool Atropos | openvein.org

Re: CSS - IE6 vs everything else issue

Posted by: scjessey
Posted on: 2006-08-15 14:31:00

This article may also be of use to you: http://wiki.dreamhost.com/index.php/Two-Column_Layout

Re: CSS - IE6 vs everything else issue

Posted by: crimsondryad
Posted on: 2006-08-15 18:15:00

Thank you a ton! Sometimes it takes a fresh set of eyes. I swear I tried setting the table width last night, but I guess not. :P

I actually didn't want to get stuck in a traditional 2-column layout because I'm generating the header and footer using PHP and the content on the page will not all use the space the same way (ie, I wanted to be able to put a div the whole way across the bottom content section if I needed to).

Now I just need to figure out why my container div background image is showing in a thin line right at the bottom of the page. (No good deed goes unpunished...heheh).

Thanks again!

================================
Angela Gann
CrimsonDryad Web Design Services
Web Design, Custom Software Development
http://www.crimsondryad.com

Tags: ie7ie6csswallurlhttp