I am creating a website where I have created a fullscreen button, which can be kind of useful on mobile - at least for my website. This is done through some Javascript. However, if I'm not mistaken, this fullscreen mode does not work in Safari (or maybe just iOS in general). So basically, I would like to remove the button in those cases, since it doesn't work for them.
Can this be accomplished with CSS, or do I need some Javascript as well ?
I think this is what you are looking for:
@supports (-webkit-touch-callout: none) {
/* CSS specific to iOS devices */
}
@supports not (-webkit-touch-callout: none) {
/* CSS for other than iOS devices */
}