28172 sujets

CSS et mise en forme, CSS3

Bonjour je souhaiterais un peu d'aide, je suis stagiaire pour une librairie où je fais un site web.

J'ai un petit soucis avec mon background pour ma résolution l'affichage est parfait mais des que l'on réduit la fenêtre mon background est rogner Smiley decu .

Voir sur http://librairiegensdelalune.fr

J'ai essayé de le mettre dans un div mais il ne s'affiche plus du tout.

Donc voila, merci de votre aide!
Salut,

C'est un comportement tout à fait normal. Pour les grandes résolutions, le fond est présent, ce qui meuble un peu le vide autour du contenu du site et doit attirer l'attention vers ce même contenu. Par contre, pour ceux qui ne disposent pas d'une très grande résolution, ce fond s'estompe au profit du contenu, qui occupe proportionnellement une plus grande part de l'écran.

Personnellement je suis en 1920x1080, donc je vois l'intégralité de ton fond, et même au delà. Tu devrais mettre un fond vert en plus de l'image pour qu'à l'extérieur de ton image de fond ca ne redevienne pas blanc, et que ca conserve le focus visuel sur le contenu au centre. Smiley smile
Administrateur
Bonjour et bienvenue, Smiley smile

pour quelle résolution et qu'est-ce que tu entends par rogné ?
Aide-toi de la Web Developer Toolbar / Redimensionner pour le 1024x768 et le 1280x1024
Le programme Resizer pour les autres navigateurs.

Je vois d'autres problèmes :
- le bandeau a.accueil fait 350+670px = 1020px c'est beaucoup trop pour ceux qui sont en 1024.
Il faudrait qu'il soit centré comme ta colonne de contenu. Et la zone cliquable ne coïncide forcément pas avec le rectangle car celui-ci est incrusté dans l'image de fond. Mieux vaudrait en faire un lien incluant une image HTML et ne pas avoir ce rectangle dans le fond.
- ton fond est immense et les couleurs tristounettes : tu pourrais le refaire en PNG vu le faible nombre de couleurs unies utilisées ; ça devrait bien se compresser si tu transformes les 12.000 nuances de vert du JPG en une seule pour le PNG par exemple. Il y aurait moyen de n'utiliser pour le motif qui se répète qu'un seul bandeau qui se répète mais possible que ce soit pas simple à faire en CSS, à voir comment le DIV supplémentaire devrait être rajouté ...
Mikachu a écrit :
Salut,

C'est un comportement tout à fait normal. Pour les grandes résolutions, le fond est présent, ce qui meuble un peu le vide autour du contenu du site et doit attirer l'attention vers ce même contenu. Par contre, pour ceux qui ne disposent pas d'une très grande résolution, ce fond s'estompe au profit du contenu, qui occupe proportionnellement une plus grande part de l'écran.

Personnellement je suis en 1920x1080, donc je vois l'intégralité de ton fond, et même au delà. Tu devrais mettre un fond vert en plus de l'image pour qu'à l'extérieur de ton image de fond ca ne redevienne pas blanc, et que ca conserve le focus visuel sur le contenu au centre. Smiley smile


Je veux bien que ce soit normal mal le fond est important et c'est pour ça que je veux pas qu'il soit rogner. Il représente la façade du magasin c'est une sorte de vitrine que je souhaite faire donc pour cela le fond ne doit pas être rogner. J'ai pensé au fond vert comme tu le dis mais le problème est que ce n'est pas à moi que ça doit plaire mais au patron donc ça restera blanc malheureusement
Felipe a écrit :
Bonjour et bienvenue, Smiley smile

pour quelle résolution et qu'est-ce que tu entends par rogné ?
Aide-toi de la Web Developer Toolbar / Redimensionner pour le 1024x768 et le 1280x1024
Le programme Resizer pour les autres navigateurs.

Je vois d'autres problèmes :
- le bandeau a.accueil fait 350+670px = 1020px c'est beaucoup trop pour ceux qui sont en 1024.
Il faudrait qu'il soit centré comme ta colonne de contenu. Et la zone cliquable ne coïncide forcément pas avec le rectangle car celui-ci est incrusté dans l'image de fond. Mieux vaudrait en faire un lien incluant une image HTML et ne pas avoir ce rectangle dans le fond.
- ton fond est immense et les couleurs tristounettes : tu pourrais le refaire en PNG vu le faible nombre de couleurs unies utilisées ; ça devrait bien se compresser si tu transformes les 12.000 nuances de vert du JPG en une seule pour le PNG par exemple. Il y aurait moyen de n'utiliser pour le motif qui se répète qu'un seul bandeau qui se répète mais possible que ce soit pas simple à faire en CSS, à voir comment le DIV supplémentaire devrait être rajouté ...


Rogner c'est à dire que pour ma résolution le fond d'écran de http://librairiegensdelalune.fr s'affiche entièrement et que si on réduit la fenêtre il disparait et moi je ne veux pas qu'il disparaisse je veux qu'il y est une barre de défilement à la place plutôt car se cadre est important.

Les couleurs sont tristounettes je leurs ai dis que c'est ce qui resorté à chaque fois mais eux ça leurs plait voila.
Et pour le bandeau qui ce répète je ne suis pas trop une professionnelle je sais pas vraiment trop comment m'y prendre.
Et pour le lien il faut que je le mette en pourcentage c'était un teste pour le moment
Salut,

Il faudrait alors mettre l'image appelée dans le code html, qui occuperait 100% en largeur et en hauteur. Mais bien évidemment, selon la résolution d'écran du visiteur, l'image risque de conséquemment se déformer. La solution parfaite pour cela n'existe pas à ma connaissance.

a écrit :
J'ai pensé au fond vert comme tu le dis mais le problème est que ce n'est pas à moi que ça doit plaire mais au patron donc ça restera blanc malheureusement

C'était juste un tout petit conseil pour améliorer les choses, mais bon quand un goût personnel prend le pas sur la logique on ne peut pas faire grand chose, tant pis. Smiley cligne
mais moi je veux une solution magique!! lol
Le site me plaisait beaucoup au début, j'étais assez fière de moi mais il est vrai qu'il est triste j'ai essayé d'arranger les choses mais ce n'est pas encore mis en ligne.

Je veux pas que ce soit déformé ni couper enfet je veux juste que la barre de défilement permette de voir les bords de mon fond même en petite page et pour ça je pensais à un div mettre le fond dedans mais il veut pas s'afficher et je comprends pas pourquoi.
Salut,

Il me semble que si tu veux un site fixe (pas proportionnel) quelle que soit la résolution, il te faut effectivement créer un div qui englobe tout et qui soit fixé à la taille de ton background-image.
Je ne comprends pas quand tu dis qu'il ne s'affiche pas. Quel code as-tu rajouté ?
Je vais pas engagé un pro c'est débile je suis stagiaire.


Et pour le div mon fond s'affiche en fait je viens de retester mais il y a un pb il y a une bande blanche en haut et il est décalé à environ 200px et je vois pas d'ou ça viens j'ai fais un test pour enlever cette marge mais ça me remontre le contenu du site ce qui reviens au même pour moi.