Need help w/IE7 & CSS

[davidsain]

Hi all,

I'm new around here. I found this site when I had some sound questions (ended up figuring it out on my own - well, a certain Big Guy threw some ideas my way).

I have a question regarding CSS and IE7. I'm working on a prototype of a new design and can't get my main body to display correctly with ie7. Works mostly in 5.5, great in IE6, FF/Safari. Simple page is here (www.resurrection.org/dev/vision.htm).

I've done all this by hand, using as much inspiration as I can find in books and other people's sites, but I'm not all that experienced with CSS. I also know I don't have to use the js code for my browser detect (found that out after I had it in place) as ie can read through the comments, but it's there. Maybe I'll clean it up later.

I have different CSS for IE6, ff (and everything else compliant), and ie7. Any ideas would be greatly appreciated.

Thanks,
David

Edit - I've attached the troublesome CSS (has to be txt for this site however, so just ignore the txt extension)

[davidsain]

Got it! Just had to spend time reading and cleaning up stuff. Now to make IE6 work... I suppose that might be a new thread.

D~

[twj]

I've read on another forum that IE6 and CSS don't play well together. Have fun.

Originally Posted by twj

I've read on another forum that IE6 and CSS don't play well together. Have fun.

That's a seriously generalized statement. Browsers and CSS don't get along in general. You can actually write different CSS for different browsers and versions, then code your page to look for the browser and version and use the appropriate CSS. CMN does this. That's one reason why it's not a good idea to have your proxy tell sites you're using a browser that you aren't. There is code that you can use to tell IE8 to act like IE7. IE6 should be considered obsolete, however.

[davidsain]

Originally Posted by Tim Eason

... You can actually write different CSS for different browsers and versions, then code your page to look for the browser and version and use the appropriate CSS...

I have some javascript that does exactly that, detecting browsers and using the appropriate CSS. I'm having an issue where a container doesn't contain all the other objects it's supposed to. Similar code works fine for IE7 and FF.

Here's the idea:
body
div id="container"
div id="header"

/div !--header--
div id="contentWrap"
div id="nav"

/div
div id="main" style="text-align:left"

/div !-- main --
div id="footer"

/div !--footer--
/div !--contentWrap--
/div !--container--
/body

In IE6 the div "container" only contains the header. I threw in a border (dashed red) and it's only around the header. Don't know why.

http://www.resurrection.org/dev/index.html

I'm only working on presentation in IE6, IE7, and FF for now. IE6 is important because a fair amount of our traffic is international, specifically Africa, and people there don't always have the latest and greatest browsers/OS's. (I even look at this w/IE5.5 from Win95 in a virtual machine)

[davidsain]

Resolved. I don't know why I was having the problem. Some pages (without the left nav) were fine. I removed the

contentWrap and everything played fine. Later I added a div to contain only the nav and main (to force a min height) and it works perfectly. I'm still at a loss why it didn't work, but I'm a happy camper now.