Home/ Questions/Q 829639
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T03:54:57+00:00

We have a project that will need to work in IE6,7,8. I’m not that

  • 0

We have a project that will need to work in IE6,7,8.

I’m not that experienced with stylesheets, however I know there are various ways to load stylesheets depending on browser type.

My question is, is it possible to have a Master stylesheet that all of the browsers will use and then import an additional one that overwrites various styles to account for browser implementation, or do I need to just have one CSS per browser that will have mostly the same code in it just different when workarounds need to be done.

Perhaps I’ve been doing too much OO lately and I’m used to my nice inheritance etc.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    No sites I know of actually manually keep different versions of a big CSS file for each browser. Usually, they just keep a main stylesheet and sub-stylesheets as per in the first case, but merge them together using a script into a static file. Maintaining a different copy of all of the CSS styles for each browser is just not worth the trouble.

    The two ways you listed both are valid, and have their own advantages:

    Master stylesheet with sub-stylesheets for each browser: This method is simple and works well normally.

    • Pro: It doesn’t require you to have a script to merge the browser-specific stylesheets with the main stylesheet before they’re displayed to the user.
    • Con: More pages need to be loaded, and this might be a bit slower; CSS precedence problems may be harder to debug, since the CSS is spread across multiple pages

    Merged master stylesheet and browser-specific stylesheets: This method is ideal for big (and I mean big) sites that have lots of requests: (e.g. Yahoo, which has this CSS file that accepts a query string to merge CSS files); the Pros and Cons are basically the converse of the above.

    I recommend that you simply choose the first solution unless your site is very big; with PHP and server-side browser detection, the code might be like this:

    echo "<link rel='stylesheet' type='text/css' href='/css/main.css' />\n";
$browser = get_browser(null, true);
$browser = $browser['browser'];
if ($browser == 'Firefox') {
    echo "<link rel='stylesheet' type='text/css' href='/css/firefox.css' />\n";
} elseif ($browser == 'Internet Explorer') {
...

    Please note that it is best if your design requires no browser-specific CSS at all. Most of the time, it is not necessary and caused by a bad understanding of CSS attributes. To fix minor default browser discrepancies, a CSS library such as YUI reset can be very helpful.

    • 0