Problème résolution d'écran

Bonjour,

Voici mon site : http://www.jeniworld.com

J'ai un problème de résolution d'écran : le site ne marche qu'avec la résolution 1024*768, et pas avec les autres.
J'ai beau avoir mis des % partout, lis et relis le tutorial (http://www.alsacreations.com/tuto/lire/547-Faire-un-site-pour-toutes-les-resolutions.html), rien n'y fait.
Je ne vois pas d'où vient l'erreur.
Le css est là : http://www.jeniworld.com/code.css

Merci d'avance,
Jennifer

jenn75 a écrit :
Bonjour,
Voici mon site : http://www.jeniworld.com
J'ai un problème de résolution d'écran : le site ne marche qu'avec la résolution 1024*768, et pas avec les autres.
J'ai beau avoir mis des % partout, lis et relis le tutorial (http://www.alsacreations.com/tuto/lire/547-Faire-un-site-pour-toutes-les-resolutions.html), rien n'y fait.
Je ne vois pas d'où vient l'erreur.
Le css est là : http://www.jeniworld.com/code.css
Merci d'avance,
Jennifer

Superbe ton site, j'aimes bien les teintes
Bon pour le reste tu a une image de 900px et ça forcément ça bloque un peut tout !

<img src="layout18.png" alt="layoutv18" width="900" height="540" border="0" usemap="#Map" />

Il va falloir repenser a cela si j'ais une idée, je te le dis !
Modifié par FoxLeRenard (24 Feb 2009 - 02:06)

Salut,

Ton design est fluide mais pas ton background qui est simplement centré. Ton problème vient de là.

FoxLeRenard, j'veux bien avoir ton idée, merci
MINATA, j'ai mis le background-position à 50%, mais le problème persiste,
je ne sais pas quoi faire

Merci d'avance,
Jennifer

Alors, avant toute chose, essaye d'épurer ton code HTML et de le rendre valide.

Une fois valide, reviens par ici, les choses seront plus simple pour corrigé ton problème.

Pourquoi utilises tu les Iframe ?

La seule chose que me reproche le validateur w3c sont les liens
de google ou les liens concernant le compteur & le "music player" généré automatiquement
par des sites externes.
A part cela, il y a pas d'erreurs.
J'ai mis une iframe car c'est plus simple et plus pratique.
Je ne pense pas que l'iframe soit le problème car les autres rubriques sont des <div>, et pourtant elles décalent aussi.

Cordialement,
Jennifer

jenn75 a écrit :




J'ai un problème de résolution d'écran : le site ne marche qu'avec la résolution 1024*768, et pas avec les autres.

Je ne vois pas d'où vient l'erreur.

Ton image de back round fait 900px horizontal; pour la voir, c'est 1024 minimum...
Si tu veux un conseil, ça sert à rien d'avoir une image de fond aussi grande aver un motif qui se répète. essaye de trouver le cycle du motif (comme pour le papier peint) et tu fais un repetX dans ton div =>image moins lourde, s'adapte au besoin de la page et à la résolution de tout écran _même un 14 pouces.
Ensuite, si tu veux que tes éléments se positionnent sans flottements, évite les div position=absolute.
Regarde comment fonctionne les positionnements float, ça t'aidera à agencer les parties et tu pourras aller vers le CSS3.

Heuu je n'ai pas trop compris

il faudrait faire une <div> avec ton image en background ainsi que margin-left et margin-right en auto. En normalement cela fonctionne mais je sais pas si cette manière est très correct...

Bonjour,

C'est pourtant extrêmement simple. Ce design est composé de deux choses: 1) une image de fond, et 2) des blocs de contenu.

Pour que le design «fonctionne», il faut que les blocs de contenu se placent aux bons endroits sur l'image de fond. Seulement voilà:

A. L'image de fond a une largeur fixe en pixels. Le navigateur web ne va pas, par l'emploi d'une magie obscure empruntée à Monsieur Sidi voyant marabouteur efficace retour de l'être aimé, s'amuser à redimensionner ton image pour l'adapter à la largeur de la fenêtre. C'est bien simple: les navigateurs ne font pas ce genre de chose.
Concrètement, cela veut dire que si ton image fait 900px de large, elle garde cette largeur dans tous les cas.

B. Les blocs de contenu ont une largeur fluide, exprimée en pourcentage de leur conteneur ou de la largeur de la page.
Concrètement, cela veut dire que si ton bloc fait 900px lorsque tu es en 1024, il fera entre 700 et 1500 pixels si tu redimensionnes la fenêtre entre 800px et 1600px par exemple.

Une largeur fixe, une largeur qui varie: forcément ça peut pas coller.

Solution: tout faire en largeur fixe.