Design Troubles

[Raptre]

I've been working on a site design and I can't seem to get the page to look correctly. The problem is easily seen, but to me not easily fixed. I've tryed a number of things, but haven't had any luck.

The design looked fine using the transitional doctype in mozilla, but not in IE. I switched to the strict doctype and mozilla looks the same as in IE now. It has been deemed compliant in both XHTML 1.0 & CSS.

It appears to me to be some sort of padding or margin issue, but I'm not sure. Can someone please take a look at it for me and either give me a solution or point me in the right direction?

http://www.accessadult.org
http://www.accessadult.org/style.css

[gohankid77]

I can't see any problems...

[Webforumz Staff]

When I looked yeterday there were problems, but I didn't have time to look into them in detail. Now they're obviously fixed - I assume you found the answer you were looking for?

[Raptre]

Sorry I lost track of this thread...

Yes the design issue has been resolved unfortunately not to my liking as it doesn't validate now. In order to get it to view correctly for IE & Mozilla I had to add a padding to IE but not to Firefox... Here is the coding I used to fix the problem.

padding: 0px;
* padding: 3px 0px 0px 0px;

That fixes all the issues, but it gives me validation errors because of it.

[D3mon]

just drop the *.
also, when using 0, the units don't need to be specified e.g.

padding: 0px;
padding: 3px 0px 0px 0px;

is the same as:

padding: 0;
padding: 3px 0 0 0;

[cromlech]

If you want to feed padding only to IE, just use the selector that only IE is stupid enough to read the contents of:

* html <your element> {
padding: 3px 0 0 0;
}

It's a valid selector, allthough most browsers will understand that it doesn't actually describe any element at all seing as html may never have a parent. IE (6, 5.5, 5) on the other hand sees this as html <element>. Handy and valid trick!