How to change CSS according to user Operating System

Question

How can i write CSS that handle a different effect on Mac OS and different on other OS versions.

i.e.

.(mac){
      height: 100%;
      width: 100%;
      overflow: hidden;
}


 .(win and linux){
      height: 100%;
      width: 100%;
      overflow: scroll;
}

You could check the OS (or actually, browser `user agent` wich tells you its OS) with JavaScript, and dynamically load your CSS files — Randy, Aug 18 '16 at 07:53
http://stackoverflow.com/questions/11219582/how-to-detect-my-browser-version-and-operating-system-using-javascript — Randy, Aug 18 '16 at 07:56

score 2 · Accepted Answer · answered Aug 18 '16 at 08:10

2

You cannot do this with pure CSS, you can detect OS like MAX or WIN with JavaScript, and then use that to load different CSS styles.

You can use the result of window.navigator to find information about the OS.

console.log(window.navigator);

answered Aug 18 '16 at 08:10

Radex

4,700
11
33
64

1

Thanks for the Answer. console.log( window.navigator.appVersion.indexOf('Mac') ) would work best. – MrOnyancha Aug 18 '16 at 08:23

How to change CSS according to user Operating System

1 Answers1

Linked

Related