1485 sujets

Web Mobile et responsive web design

Bonjour à tous,

J’aimerais faire une page d’accueil avec une image en responsive sur tous devices mais il s’avère que ma technique ne soit pas effective sur mobile Samsung ou Honor... Ca fonctionne cependant très bien sur ordinateur, sur tablette et iPhone.

Une idée pour que l’image aille jusqu’en bas de l’ecran ? J’ai essayé plusieurs background-position, des @medias, mais en vain...

Pourriez-vous m’aider à resoudre ce casse-tête ?

Le lien vers la page concernée : http://www.gadaut.com/dev/index3.html

En image ce que l’on voit sur Honor ou Samsung à gauche et à droite, upload/1553417026-74957-0124b902-c58a-4af2-b548-2d7f.jpeg ce que l’on voit sur iPhone et ce que j’aimerais avoir sur tous les portables Smiley smile
Bon dimanche et merci par avance pour vos idées lumineuses !

Waxelly.
Administrateur
Hello,

Difficile de débuguer sur un device que l'on n'a pas mais je vais tenter, par logique.

Tu as appliqué ton image de fond sur l'élément body, mais celui-ci n'occupe pas toute la hauteur par défaut.
Peux-tu tester de lui appliquer un min-height: 100vh; pour être sûr que tous les navigateurs lui attribuent une hauteur de page ?
Meilleure solution
Hello Raphaël,

Je viens de faire le test sur le lien sus-mentionné et ça fonctionne beaucoup mieux mais une partie de l'image est rognée, je suis donc en train de réduire et recadrer le centre de l'image pour qu'il rentre dans la zone utile… A quoi cela est-il dû ?

Je continue mon ajustement et je regarde si c'est ok !

Je ne connais pas cette unité vh, à quoi correspond-t-telle ?
Merci beaucoup pour ton aide Smiley biggrin Smiley biggrin Smiley biggrin