Le viewport iPhone 18 Pro Max utilisé par Mobile Preview est de 440 × 956 pixels CSS en portrait et 956 × 440 en paysage. La caméra est : Dynamic Island.
La taille en un coup d’œil
| Portrait | 440 × 956 px |
|---|---|
| Paysage | 956 × 440 px |
| Rapport hauteur / largeur | 2.17 |
| Caméra | Dynamic Island |
| Tailwind (portrait) | en dessous de sm (moins de 640 px) |
| Tailwind (paysage) | md (à partir de 768 px) |
Ce sont des pixels CSS (de mise en page), les tailles du cadre de Mobile Preview. Sur un vrai appareil, l’interface du navigateur, le réglage de zoom de l’affichage ou la version du système peuvent les faire varier légèrement.
À tester en CSS
Préférez des breakpoints basés sur votre contenu plutôt que des règles par appareil. Pour reproduire exactement cette taille, par exemple pour déboguer une mise en page, cette media query la cible en portrait :
@media (width: 440px) and (height: 956px) {
/* iPhone 18 Pro Max, portrait */
}La découpe (Dynamic Island) empiète sur le haut de l’écran dans les mises en page plein écran. Ajoutez viewport-fit=cover à votre balise meta viewport, puis ajoutez un padding avec env(safe-area-inset-top) aux en-têtes fixes pour que rien ne passe derrière.
Appareils au même viewport que iPhone 18 Pro Max
Ces cadres utilisent le même viewport de 440 × 956 : une seule vérification les couvre tous :
Prévisualiser iPhone 18 Pro Max dans VS Code
Le cadre iPhone 18 Pro Max fait partie de Mobile Preview Pro (6,99 €, paiement unique, sans abonnement). La version gratuite inclut l'iPhone 16, l'iPhone 17 et l'iPhone 17 Pro Max. Installez l’extension, lancez votre serveur de développement, exécutez « Mobile Preview: Show » et choisissez iPhone 18 Pro Max dans le menu des appareils : votre page s’affiche dans le cadre à côté de votre code et se recharge à chaque enregistrement.
Largeurs proches
- iPhone 15 Pro Max (430 × 932)
- iPhone Air (420 × 912)
- Samsung Galaxy S25 Ultra (420 × 915)
Questions fréquentes
- Quelle est la taille du viewport iPhone 18 Pro Max en pixels CSS ?
- 440 × 956 en portrait (largeur × hauteur) et 956 × 440 en paysage, telles qu’utilisées par Mobile Preview. L’écran physique a plus de pixels ; ce sont les pixels CSS que voit votre mise en page.
- Dans quel breakpoint Tailwind se situe iPhone 18 Pro Max ?
- Avec les breakpoints par défaut de Tailwind, iPhone 18 Pro Max est en dessous de sm (moins de 640 px) en portrait et md (à partir de 768 px) en paysage.
- Puis-je prévisualiser mon site sur iPhone 18 Pro Max dans VS Code ?
- Oui. Le cadre iPhone 18 Pro Max fait partie de Mobile Preview Pro (6,99 €, paiement unique). La version gratuite inclut l'iPhone 16, l'iPhone 17 et l'iPhone 17 Pro Max.
Toutes les tailles d’appareils · EN · ES · PT · DE