Question

I want to apply different css on different browsers.

I want to run one css when it is safari and second for all others.

How can I detect that and apply css according to that?

Answer 1

You can use CSS browser selectors for this. There are different solutions available for this on the net.

For example:

CSS Browser Selector

The CSS Browser Selector is a small JavaScript library which allows you to include different cascading style sheets (CSS) for each browser.

An example:

<style type="text/css">
.ie .example {
    background-color: yellow
}
.ie7 .example {
    background-color: orange
}
.opera .example {
    background-color: green
}
.webkit .example {
    background-color: black
</style>

If you Google for “different css per browser” you’ll find other solutions as well, but most of them boil down to similar solutions.

Another way would be to detect the browser type and capabilities in ASP.NET so that you can render the appropriate HTML / CSS / …etc. You can find more information on that topic here:

http://msdn.microsoft.com/en-us/library/3yekbd5b.aspx

For example:

private void Button1_Click(object sender, System.EventArgs e)
{
    System.Web.HttpBrowserCapabilities browser = Request.Browser;
    string s = "Browser Capabilities\n"
        + "Type = "                    + browser.Type + "\n"
        + "Name = "                    + browser.Browser + "\n"
        + "Version = "                 + browser.Version + "\n"
        + "Major Version = "           + browser.MajorVersion + "\n"
        + "Minor Version = "           + browser.MinorVersion + "\n"
        + "Platform = "                + browser.Platform;

    TextBox1.Text = s;
}

The Browser property of the Request returns a HttpBrowserCapabilities object. It contains information on the capabilities of the browser that is running on the client.

http://msdn.microsoft.com/en-us/library/system.web.httpbrowsercapabilities.aspx