Hi I've cross browser fixed a site on all thinkable PC browsers, including Safari.
Now my smart ass designer sent me a screen shot of the whole layout collapsing on mac.
I have an idea how to solve it (reduce the margin on an element by a few pix), but i don't know how to target Safari only, preferably Safari mac only.
What's the best way to do this?
views:
243answers:
4The user agent string contains operating system information, and you are probably already checking the user agent string for the browser type.
A mac browser will have the string "Mac OS X 10." in the user agent string.
You probably need to run a regex query against the User-Agent and selectively load a CSS file just for Safari for Mac.
Also: Are you sure that Safari for mac and safari for windows render the same page drastically different?
You can use JavaScript to detect the browser, and the platform, as detailed here.
There are some CSS-only hacks which take advantage of bugs in some very specific browsers (mostly different versions of IE) but none of these target Safari Mac. So JavaScript browser detection and altering of the style attributes is your best bet.
In my opinion browser detection is a very bad idea. If you can make it work in IE you should have no problem making it work in Safari. Please post a link and I will take a look.