Can You Target Google Chrome

Can you target Google Chrome?

@media screen and (-webkit-min-device-pixel-ratio:0) {

    /*Chrome CSS here*/

    #cartUpdate {
        position:absolute;
        width:160px;
        height:30px;
        left:660px;
        bottom:40px;
    }
}

Fixed the problem :)

UPDATE

This resource works better: CSS browser/OS selectors with JS.

Is it possible to target Chrome only, not all Webkit powered browsers?

There are browser-specific CSS hacks that might work for this problem now, but they certainly aren't supported.

IMHO, your best bet is to add a class to the body tag using JavaScript that reads your navigator.userAgent and use that class (body.chrome for example) to target Chrome.

Target only Google Chrome on windows

You could get the browser and OS platform using navigator api.

<!--HTML-->
<div class="notchromewindows">
....Some Content....
<div>

if((navigator.appVersion.indexOf('Windows') != -1) && (navigator.appVersion.indexOf('Chrome') != -1)) {
  $('.notchromewindows').addClass('itischromewindows').removeClass('notchromewindows');
}

Which browsers and operating systems do you target on new websites?

Mainly I just target browsers as the sites I've built don't really depend on anything OS specific. As mentioned above, YAHOO's graded browser support guide is a good starting point on determining which browsers yous should/could support. And Yahoo's User Interface library (CSS+JavaScript) helps massively in achieving this.

But when developing sites I primarily do it on Firefox2 as it has the best web developing tools (firebug + wed developer toolkit). Then I also test my sites with Opera 9.5 as it's my browser of choice for browsing. I've previously lost all hope on supporting IE6 at any reasonable level so these days I just inform my users to upgrade to IE7 which is almost capable of displaying sites similarly to FF2/3+Chrome+Opera.

FF3 and Chrome are so new at the moment that I tend to ignore them, but I must say: They're friggin fast! My javascript/css heavy sites are noticeably faster with them.

How to ONLY target Chrome DevTools window in CSS?

Ok, so after digging around, I noticed I actually missed the notice right smack dab at the top of the original article page:

Since publishing this article the Chrome Team have added a unique ID
to the container of the Chrome Dev Tools. The ID is #-webkit-web-inspector(Trac Reference)

So, the fix to my above post is to add body#-webkit-web-inspector to all of your selectors and it works perfect, thus only targeting chromes DevTools window. Also, very important... to those wanting to create a more complete theme, it’s HIGHLY RECOMMENDED to do it via "inspecting the inspector". More info on how to do this can be found here: How do you inspect the web inspector in chrome?

See screenshot below of "inspecting the inspector":

Disable same origin policy in Chrome

Close chrome (or chromium) and restart with the --disable-web-security argument. I just tested this and verified that I can access the contents of an iframe with src="http://google.com" embedded in a page served from "localhost" (tested under chromium 5 / ubuntu). For me the exact command was:

Note : Kill all chrome instances before running command

chromium-browser --disable-web-security --user-data-dir="[some directory here]"

The browser will warn you that "you are using an unsupported command line" when it first opens, which you can ignore.

From the chromium source:

// Don't enforce the same-origin policy. (Used by people testing their sites.)
const wchar_t kDisableWebSecurity[] = L"disable-web-security";

---

Before Chrome 48, you could just use:

chromium-browser --disable-web-security

How to resolve chrome frameset target attribute issue

Holly Shit!!!
Guys, after 4hr of extensive debugging now i got the cause for which all these crap was happening. The thing is... in one of my javascript file i've used a variable by name as 'name'. Like this..

var name = false; 

And, this 'name' was creating problem in webkit page rendering engine which used by both Google Chrome & Safari. After, googling a bit i got to know that 'name' is a reserve keyword in JavaScript. But,even if this.. IE & Mozilla have no issue with it. But, webkit has some issue.

---

Related Topics