Detect Chrome browser in HTML

Question

How can I detect the Google Chrome browser? For example, I can detect Internet Explorer with this tag:

<!--[if lte IE]>
<link href="ie_only.css" rel="stylesheet" type="text/css" />
<![endif]-->

I have one idea:

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;

But maybe somebody has a better solution?

Update: My page shows wrong only with Chrome browser, so i need load (only with chrome) special css file with updates

Answer 1

As mentioned in the comments above, you should be detecting feature compatibility, not browsers. That said, there are rare occasions when you need to target WebKit browsers in your CSS. For example, I had a minor font size/rendering issue that only appeared in Chrome/Safari, and I fixed it with something like this:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  /* Chrome- and Safari-specific CSS here*/
}

Another warning: If something renders incorrectly in Chrome/Safari but not in Firefox, there's a good chance you have some other underlying issue, e.g. invalid markup. Be sure to validate your HTML and check for other problems before using the (slightly hackish) method above.

Answer 2

var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
if (is_chrome) {
    document.write("Yaii it is Chrome only")
}

From: "Simple way to detect chrome browser using javascript"