How do I write media query for Chrome and Safari on iPad mini
I have viewport height issue with a header which is 60px; When I subtract viewport height,
height - 85px (Safari) height - 60px (Chrome)
only safari one execute
@media screen and (-webkit-min-device-pixel-ratio: 0) { /* Safari and Chrome */ .mbox{ height: -webkit-calc(100vh - 60px); } /* Safari only override */ ::i-block-chrome, .mbox{ height: -webkit-calc(100vh - 85px); } /* or Safari only override */ _::-webkit-full-page-media, _:future, :root , .mbox{ height: -webkit-calc(100vh - 85px); } }
how do I write chrome media query separately