Browsers And Css Differences in displaying CSS

[theRealSheep 0]

(This looks like the best place to post this.. )What do other users do to 'work-around' the differences in displaying CSS attributes in different browsers? Mainly Internet Explorer which doesn't fully conform to CSS unlike the Mozilla browsers and where older browsers like Netscape 4.x which have only minimal CSS implementation.On my website, now that I have converted it to PHP, I use a couple PHP 'if' statements to detect the user's browser and link them to different style sheets, depending on their browser (IE, N4 or everything else). I did read about using some 'CSS @import hack' to trick different browsers, but I couldn't get it to work. Has any one else tried this method or do you have something better you use?

[mizako 0]

With a bit of patience a good crossbrowser result can be achieved. I design in the next Way:- First i design for Firefox.- Validate Markup (XHTML code) and CSS with W3C validators.- Test the web-site with IE and Opera. Sure you will find some differences but with a fine adjustment of your CSS file you may achieve your desired effect.Adjust for your potential visitors. IE users are important since there are more!!!.As you can see i do not use browser detection but depending of the proyect importance maybe it is necessary in your case.

[nonon 0]

Well i would be very interested in such method...can someone post-it out? please Nowdays i test the site in Firefox, but i've got to do the same test on IE, i try to make something that works out well for both,i always achieve...but they do look very different as in Firefox the forms are smaller,etc,etc...Good LuckCheersNuno

[Tyssen 0]

I did read about using some 'CSS @import hack' to trick different browsers

67882[/snapback]

If you use

<style type="text/css" media="screen">@import "yourfile.css";</style>

it'll hide the CSS from older browsers like N4 which means they'll get all your content unstyled. If you're creating your site with tables this can look quite unsightly, but if you've created your site using valid XHTML mark-up, it will be better (although everything will be unstyled, no background images etc.)

(For an example of what I'm talking about, check out this page. That page has lost the link to its CSS. If you scroll down to the bottom of the page and click on any of the links under Designs, you'll see what it should look like.)

Like Mizako says, you should be able to code everything into the one stylesheet to get all modern browsers to display your page properly and I use the same sort of process he/she does when designing: start with Firefox then get it right in the others.

I personally wouldn't bother trying to get your pages to work in N4 or earlier - I think less than 1% of the browser market still use those.

[rvovk 0]

I agree on doing site in valid XHTML and CSS code. This will ensure to have it properly displayed in Mozilla Firefox and probably Opera. Next thing you must do is to check it in Internet Explorer. YOu will probaly have to make IF variables for some elements to be properly displayed. I really don't bother with IE4 and NN4 browsers. I like to have site properly displayed in Internet Explorer 6.0, Firefox and Opera. Internet Explorer 5.0 and 5.5 need more of workaround, but it can be done.

Good thing to check is W3C School.

[Tyssen 0]

YOu will probaly have to make IF variables for some elements to be properly displayed.

Not if you get your CSS right. It's possible to make your page look nearly exactly the same (font-size variations prevent absolute similarity) by careful CSS coding. It does take a while to get your head around all the tricks & hacks that you sometimes need to use to get things to look right in IE, but it's like anything else: once you know how to solve a particular problem, you're fine.