Browser Issues

[dNep]

OK. Having quite the issue. I'm at the very end of a large website and just
now starting to have some browser issues that I have not been able to figure
out. Some background info, I create on a Mac G5 using OS 10.3.9 and
Dreamweaver mx 2004. I do not have Dreamweaver on the PC but I do have the
PCs to test on. The link where this site can be found at present time is:

[url]http://www.msmmarcom.com/newNYCC[/url]

If anyone has any insight, I would greatly appreciate it. Thanks in advance

Problems listed below.

First Problem:
Internet Explorer on a PC only
Gaps in my header where header meets body plus two other similar gaps in the
drop shadow on each side of header above the area where main navigation resides.

second problem:
FireFox on PC and Mac
Missing Site Map link on footer. Link appears fine in Safari and IE on PC and
Mac.

third problem
IE on PC
On footer top half of person graphic shifted to left. Appears fine on other
browsers.

Thanks again for any help.

[artcoder]

No doubt these are CSS cross-browser compatibilities issues caused by different
browser interpreting the CSS differently. Ideally, one would be testing on the
various browsers as one is coding the site. That way you know right away and
which piece of code is having the compatibility issue.

There are "CSS hacks" that provides workaround to these problems. See ...
[url]http://www.positioniseverything.net[/url]

and [url]http://www.webmarksonline.com/articles/css.htm[/url] (scroll down to CSS bugs
and hack)

Or asks the CSS gurus at
[url]http://www.css-discuss.org[/url]

-artcoder (at)
[url]http://webmarksonline.com[/url]

[mzanime.com]

When your working with a very large web site its often too much work to re-code
everything from scratch so we are forced to take advantage of browser-specific
CSS quirks. Now before you try and use browser-specific CSS quirks to fix some
of these problems, it would be a good idea to make sure that your HTML and CSS
code follows the current W3C spec.

[url]http://validator.w3.org/check?uri=http://www.msmmarcom.com/newNYCC/[/url]

[url]http://jigsaw.w3.org/css-validator/validator?uri=http://www.msmmarcom.com/newNYC[/url]
C/styles.css

Once those errors are taken care of, try these:

* html body <INSERT SELECTOR HERE> { <INSERT PROPERTIES TO FIX PAGE IN IE> }

* html body { navigation: fixed-gaps; }

Only IE6 (perhaps 5.5 too but I'm not sure) mistakenly will try to read a
selector that uses the universal selector ( * ) before the "html" element. The
html element is the root element, and this should never happen, but IE6 (being
far from perfect) falls for it. So any properties you put in the above
mentioned code will only get noticed by IE, you can exploit this to try and
make your site look better in IE.


html>body <INSERT SELECTOR HERE> { <INSERT PROPERTIES HERE> }

html>body .footer { footnav:now-visible; }

Firefox is much newer than IE, and unlike IE6 it understands the adjucent
child combinator ( > ) It basically means "the body element is a child of the
html element" which is always true. But IE doesn't understand this combinator
and completely ignores the above code, but all the most recent browsers which
use the Gecko rendering engine will interpret it. (Firefox, Mozilla, Netscape,
etc.) Use this for code you *don't* want IE on Widnows to see.