Skip to content

Instantly share code, notes, and snippets.

@evanre
Created January 25, 2016 17:44
Show Gist options
  • Save evanre/13b236b23f8efbc0be7e to your computer and use it in GitHub Desktop.
Save evanre/13b236b23f8efbc0be7e to your computer and use it in GitHub Desktop.
Browser and Device specific CSS styles with SASS
document.documentElement.setAttribute("data-browser", navigator.userAgent);
// Examples
// Full list of user-agents - https://user-agents.me/
// @include browser("MSIE 11") {}
// @include browser("Android 4.0" "Android 4.1" "Android 4.3") {}
// @include browser("iPad" "iPod" "iPhone") {}
@mixin browser($browsers: Mozilla) {
@each $browser in $browsers {
html[data-browser*="#{$browser}"] & {
@content;
}
}
}
@EvgenyArtemov
Copy link

It's not working now in 2021, what could be the reason?

@evanre
Copy link
Author

evanre commented Apr 8, 2021

It's not working now in 2021, what could be the reason?

Hey, don't see any reasons it shouldn't work. The website from comments is dead, but you can google the list of user agents easily.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment