Site HTML ne s'affiche pas pareil suivant le format de l'écranFermé

Question

Bonjour à tous ! Je réalise une petite page Web perso que j'ai créée avec Notepad++. Malheureusement, mes compétences en HTML et CSS sont limitées. Mon problème est que j'ai créé ma page avec mon ordinateur 13 pouces, et l'affichage est parfait ! Malheureusement, lorsque je l'ouvre avec un ordinateur qui a un écran plus grand... l'affichage est complètement décalé... ...SVP pouvez vous m'aider ? La page est simple, elle est constituée : - d'une photo en background - d'une image (en haut à gauche) qui permet de télécharger un docx lorsqu'on clique dessus. - d'un fichier pdf qui est affiché (légèrement sur la droite) Voici mon codage : MON_TITRE

jean448 · Answer

Salut

Ton problème a mon avis vient de là : left: 35%;  

car 35% de 1000px -->350px alors que 35% 720px --> 252 px

tryan44 · Answer

Salut,

Tester en remplacent "left: 35%; " par "margin: 0 auto;" ce qui devrait centrer le div concerné.

CedNad8 · Answer

Finalement, mon problème n'est pas trop le décalage du pdf.

C'est surtout mon background, qui est fixe et bien positionné sur les 'crans 13 et 15 pouces.
Mais qui se répète sur les 17 pouces...

Des idées ??

angeha · Answer

Bonjour; recree simplement ta page web sans donner une taille au body car le body est suppose represente ta page tout entiere.
ou alors si tu veux limiter ton document par certaines dimensions, cree donc a laide de la balise div la ou les divisions a l'interieur de body. et organise les a laide de css.
courage

CedNad8 · Answer

Ah oui ça m'a l'air intéressant !
Dans mon cas, comment puis je donner une taille au body ?

tryan44 · Answer

Ou alors, supprimer la taille du body et ajouter un padding et margin à zéro, centrer et fixer sans répétition l'image de fond.
		body { 
		margin:0;
		padding:0;
		background: url("MON_BACKGROUND.jpg") no-repeat center fixed; 
		-webkit-background-size: cover; /* Chrome et Safari */
		-moz-background-size: cover; /* Firefox */
		-o-background-size: cover; /* Opera */
		background-size: cover; /* standard */
		}

CedNad8 · Answer

Merci à tous pour vos réponses, j'ai pu me débrouiller grâce à vous.
En revanche, cela ne me permet pas d'afficher la page correctement sur un Iphone ou Ipad...

Connaissez vous une technique ??

Site HTML ne s'affiche pas pareil suivant le format de l'écran

7 réponses

Discussions similaires

Newsletters