It is possible I have missed this one the forum…
What are people doing to counter clashes for iPad Pro pixel size and a desktops pixel size.
I.e iPad Pro sizes are 1366 x 1024 , 1024 x 1366 and desktop is 1280 x 800.
So for example I want some buttons to show in iPad Pro but not Desktop
Has anyone come up with a good strategy to avoid clashes
You can use a javascript to detect the device
vDevice = navigator.platform; if (vDevice.indexOf("iPhone") > -1 || vDevice.indexOf("iPod")> -1 || vDevice.indexOf("iPad") > -1) { \\do something };
Thanks @rene,
I was hoping there was a way to avoid using something like navigator.platform or user agents.
The advice seems to be they are unreliable for one reason or another.
Have you found navigator.platform to work well.?
in this article I’ve found a an interesting solution to recognize the device
$ipad-pro-portrait-breakpoint: "(min-device-width : 1024px) and (max-device-width : 1024px) and (min-device-height : 1366px) and (max-device-height : 1366px) and (min-width: 1024px) and (max-width: 1024px)";
$ipad-pro-landscape-breakpoint: "(min-device-width : 1024px) and (max-device-width : 1024px) and (min-device-height : 1366px) and (max-device-height : 1366px) and (min-width: 1366px) and (max-width: 1366px)";