Working in production verified iPhone media query. Unlike all the other posts out there which are annoyingly wrong!
/** mobile theming **/
/** iPhone styling **/
@media all and (max-width: 480px) {
.row1 {
float: left;
min-width: 30%;
max-width: 200px;
padding: 10px 10px 10px 10px;
border: 1px solid #ccc;
min-height: 15px;
}
.user-rows {
min-width: 100%;
}
}
This is any device between mobile and ipad very useful
@media (max-width:1100px) and (min-width:480px) {
}
or try:
/* ----------- iPhone 6+, 7+ and 8+ ----------- */
/* Portrait and Landscape */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3) {
}
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/