IE6 CSS compatibilty...

So...I have a website:

http://remix.thasauce.net/

And I've recently become pretty frustrated with it because the guy who designed it coded it like CRAP. So I've been working on better, cleaner version.

http://ramaserv.thasauce.net/RTS/testpage-plain.html

Everything nice and valid and easy to work with, then I do the CSS:

http://ramaserv.thasauce.net/RTS/testpage.html

For the most part everything is how I want in Firefox. I can't really check IE6 because I installed IE7 which makes IE6 inaccessible to me, but from the screens I've seen it's MAJOR broke.

I set the body text-align to center to center the whole thing (though I haven't fixed it for everything else yet) but the news and footer are TOTALLY destoryed.

Anyone have any idea how the heck to get this any less broken? (

Edit: Well, it's totally broke in IE6, too.....

Edit Edit: So...I'm not sure how, but I fixed it. Only problem, now is...the page doesn't STICK TO THE TOP of the field of view in firefox...it has 20 pixels of dead-space at the top. I can put top: -20px but that leaves the dead space at the BOTTOM and totally messes up in IE....

#410590

CSS can be very tricky, especially across browsers. For example, i'm currently making my site, www.lukevink.com. I am using wordpress to make www.lukevink.com/blog and before I fixed it, nothing showed up correctly on ie6. Now like you, i had ie7. I have now downgraded so I can fix this, (control panel, show updates, remove ie7). Basically I figure you just have to keep mucking around to find the thing thats stuffing up your site. Normally its because you have a section which is too big to fit into another section.

Your website itself seems fine in ie6, no stuff ups.. as for this site : http://ramaserv.thasauce.net/RTS/testpage.html

The website seems "broken" in both ie6 and firefox. If i'm not mistaken, you need to either make fonts smaller to fit, or inlarge the sections that they are in.

As i said, CSS is tricky, and another problem is its pretty much user specific. So unless I see all your code I cant figure out whats wrong...

But anyway, isnt your site working anyway?

- Check the margins and stuff...

#410618

Yea, I haven't really done the fonts yet, but the real problem I have right now is THIS:

It doesn't appear in IE6 or IE7, but in Firefox I have a 20 pixel gap between the top of the main DIV and the top of the actual page.

As for my main site (http://remix.thasauce.net) not being "broken", it's NOT...not technically anyway. The way it's set up now is just really sloppy. Bad classes, bad form, bad tables, and the PHP calls for way too many functions from way too many different places. I literally can't do a THING with it style wise or functionality wise...which is why I'm rebuilding the whole thing.

I wanted to do the whole thing over in completely VALID XHTML so that, if I wanted to at a later time, I could easily change/add other styles.

Also: All the CSS for the test page is in the header.

#410994

always start out with

* {

margin: 0;

padding: 0;

}

each browser has different default margins and padidngs, as in IE, it defaults to have that 20px padding...

#411070