browser compitibility

[moebius]

hey all,

is there a site where i can test an offline site on various browsers?

i dont wanna upload my site until i know for sure its how i want it to look on all browsers.

thank you!!

[shifty.ricky]

just download the various browsers and run it through them?

[Chenks]

http://www.w3.org/

you can test offline files there
if it's coded properly it should work on all browsers

[Cosmo_1847]

I just downloaded different browsers and tested it on them for bugs. I made a quick script in applescript for my mac so it loads one page in 3 browers.

[moebius]

I have firefox, IE but I dont have Safari..is that available for Windows?


and im not even gonna try for netscape lol.

[Danny Boy]

if it's coded properly it should work on all browsers

Very close to true. The correct statement is:

"if it's coded properly it should work on all browsers (except IE)"

IE does not properly implement css rules such as widths, margins and padding. In all other browsers a width of 100px with margin of 50px will give you an overall width (everthing inside the outer part of the margin) of 200px (50-100-50). IE will interpret the same width and margin as meaning 100px total width including the margins. This would give you an area of 0px inside to actually display content.

To get around IE's stupidity you actually need to write incorrect code that most browsers will ignore (as its incorrect) but IE will read (as its rather stupid). For the above example, the css:
width:100px;_width:200px;margin:50px
will give you the same results for both IE and firefox as IE will read the width, then read _width as width and it will override the previous definition.

Its a hacky way around it, but it works.

</warandpeace>

[shifty.ricky]

Very close to true. The correct statement is:

"if it's coded properly it should work on all browsers (except IE)"

IE does not properly implement css rules such as widths, margins and padding. In all other browsers a width of 100px with margin of 50px will give you an overall width (everthing inside the outer part of the margin) of 200px (50-100-50). IE will interpret the same width and margin as meaning 100px total width including the margins. This would give you an area of 0px inside to actually display content.

To get around IE's stupidity you actually need to write incorrect code that most browsers will ignore (as its incorrect) but IE will read (as its rather stupid). For the above example, the css:
width:100px;_width:200px;margin:50px
will give you the same results for both IE and firefox as IE will read the width, then read _width as width and it will override the previous definition.

Its a hacky way around it, but it works.

</warandpeace>

Ah man.. you might just have well of slept with jabazcool's sister making statements like that.

I'd start running now and hope hes in a good mood. :D

[Clarksy]

Try http://browsershots.org/

Also, the IE margin / width issues are only a problem in IE 5.x. This behaviour is referred to as a "broken box model". There is a long list of IE bugs over at Position Is Everything (http://www.positioniseverything.net/ie-primer.html).

It's worthing noting that almost ALL browsers have CSS bugs - this will always be the case since programmers read a spec. and implement it. The only way to create truly standard CSS browser support would be to use a common code base - imagine that! M$ / Mozilla / Opera / Apple all using the exact same code...

[Danny Boy]

Also, the IE margin / width issues are only a problem in IE 5.x.

Well I still see the issue present in IE 6 and IE 7. It's not any form of bug, its simply the way M$ programmers have understood the CSS specification and implemented it in their software. All other browsers have interpreted the spec a different way.

[Clarksy]

Now i think about it, the only margin issue i "hack" for is the double margin float bug - i think your talking about a padding issue.

[stdRaichu]

Well I still see the issue present in IE 6 and IE 7. It's not any form of bug, its simply the way M$ programmers have understood the CSS specification and implemented it in their software. All other browsers have interpreted the spec a different way.

"Never atribute to malice what can be adequately explained by stupidity"

Doesn't really work in MS's world unfortunately. Most techies and anti-MS fundies like myself are aware that IE's inexplicable failure to conform to CSS over the last five years is an attempt to keep the web free of open standards, lest they start to lose headway in the web applications market.

The nearest approximation to Safari that'll run on a bog-standard x86 box is Konqueror, as they're both based on the same rendering engine. Grab a bootable Linux distro and you'll have a fair idea of what things will look like in Safari.

I should also point out - don't expect your site to look identical in browsers that support CSS either. Small deviations are common, and I for one find it quite easy to tell from a screenshot which engine is being used to render a site because of the small differences in formatting.