css - How to target Safari for Mac only? -


Hello, I have fixed the browser on all the thinking PC browsers including Safari. Now my Smart Ang Designer sent me a screen shot of the entire layout falling on the Mac. I have an idea how to solve it (reduce margin on an element by some pix), but I do not know how to target Safari only, preferably Safari Mac only.
What is the best way to do this? You can include a script here on your page (or in a separate js file)

after a class div class = "itemprop =" text " For the HTML element that will add you can add Safari-Mac-specific CSS to your CSS file so that 

  (function ($) {// console.log (navigator.userAgent); Adjustment for / / Safari on Mac * / if (navigator.userAgent.indexOf ('Safari') = -1 & amp; amp; navigator.userAgent.indexOf ('MAC') = -1 & amp; & Amp; navigator.userAgent.indexOf ('Chrome') == -1) {// console.log ('Safari on Mac Is installed, class is ... '); $ (' html '). AddClass (' Safari-Mac '); // Provide a class with Safari-MAC filter for specific CSS)}} ) (JQuery);

Example CSS Fix, which can be done on page or in your external CSS file etc. 

  / * Safari Mac specific changes * (depending on class By adding the above js browser detection), * about account different font metrics * / .safari-mac # page4 .section p.fussyDesigner {margin- to take correct: -15px; } .safari-mac # page8 .section-footer {width: 694px; }

Thanks for the other answers for ideas, I have tried to wrap everything in a complete solution in this answer.


Comments

Post a Comment