Медиа-запросы 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 */}

IPhone 6,7,8

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