Медиа-запросы Iphone X, относящиеся также к iphone 8 plus

Question

Я добавляю стили для iPhoneX, но это отражается и на устройствах iPhone 6,7,8 и более.

Медиа-запросы пишу

@media only screen and (min-device-width : 375px) and (max-device-width : 812px) and (-webkit-device-pixel-ratio : 3)and (orientation : portrait){
      margin-top: 5%;
}

даже попытался добавить iPhone6,7,8 плюс устройства конкретного медиа-запроса и предоставления margin-top: 0%

но это тоже не сработало. Любые ответы будут отличной помощью.

Answer 1

IPhoneX

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px)
and (-webkit-device-pixel-ratio : 3) { /* STYLES GO HERE */}

Айфон 6,7,8

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) { /* STYLES GO HERE */}