[resolu]Positionnement d'une image background

Bonjour tout le monde.
Voila en fait j'aimerais faire une page fluide (s'adaptant à son contenu).
sur la moitié de la page du haut j'aimerai avoir une image en bakground qui ne se répète pas et en suite une image en background qui se répète pour s'adapter au texte.

j'ai essayé d'imbriquer deux div chacun ayant une des images de fond et le second ayant le texte et une image de fond qui commence à top:479px (la taille de la première image) mais à priori ce n'est pas une fonction qui existe sur css.

Auriez vous une idée de structure permettant ce genre de chose.
Modifié par simon250 (24 Feb 2007 - 16:08)

En fait si j'ai bien compris, tu devrais inverser tes deux blocs : 1 bloc conteneur avec l'image qui se répète et à l'intérieur de celui-ci le bloc d'en-tete. Comme ça le background du bloc d'en-tete s'affichera par dessus le background du bloc conteneur.

Après ça tu peux aussi positionner ton image de fond avec un background-position, même pour des fonds qui se répètent :

background-position:479px 0;

Comme quoi pour faire du css on a pas forcément besoin d'être expert il suffit parfois de réfléchir et d'être un peu intelligent.
Merci d'avoir été intelligent pour moi (et d'avoir compris ce que je voulais).

par contre la seconde methode:

background-position:0px 249px; 

ne marche pas trop:
Si l'on rajpoute no-repeat tout va bien mais l'image ne se répète pas vers le bas.
Sans no-repeat l'image commence à s'afficher en haut du Div et pas à partir du 249eme pixel.

En tout cas merci beaucoup, pour l'utilisation de background position (que je ne connaissais pas),
et surtout pour m'avoir rappelé qu'il est bon de réfléchir un peu.
Modifié par simon250 (24 Feb 2007 - 05:29)

simon250 a écrit :
En tout cas merci beaucoup, pour l'utilisation de background position (que je ne connaissais pas),
et surtout pour m'avoir rappelé qu'il est bon de réfléchir un peu.

Bravo
Tu considères que ce sujet est [Résolu] ?

bah pour moi j'ai trouvé une méthode qui marche et je suis heureux, par contre d'autres personnes pourraient vouloir creuser cette histoire de:

a écrit :

Après ça tu peux aussi positionner ton image de fond avec un background-position, même pour des fonds qui se répètent :

background-position:479px 0;

qui ne marche pas.
mais si vous pensez que non alors oui mon pb est résolu.
je laisse le sujet encore une heure s personne ne rebondi je le met en résolu.

Alors pour le background-position c'est assez subtil mais ça fonctionne bien même avec un background-repeat : le background-position va déterminer la position de départ de l'image, puis elle est ensuite répétée sur toute la surface du bloc.

Bonjour,

MrPatate a écrit :
Alors pour le background-position c'est assez subtil mais ça fonctionne bien même avec un background-repeat : le background-position va déterminer la position de départ de l'image, puis elle est ensuite répétée sur toute la surface du bloc.

Pas tout à fait

Une image répétée couvrira toute la surface du contenu, du padding et de la zone de bordure du bloc, indépendamment de sa position de départ.

En d'autres termes, on ne peut pas répéter une image "à partir de X pixels" d'un des bords...
Modifié par Laurent Denis (28 Feb 2007 - 12:26)

Laurent Denis a écrit :
on ne peut pas répéter une image "à partir de X pixels" d'un des bords...

Effectivement, et c'est d'ailleurs bien dommage...

Laurent Denis a écrit :
En d'autres termes, on ne peut pas répéter une image "à partir de X pixels" d'un des bords...

Oui c'est ce que je voulais dire en fait, l'image couvrira forcement toute la zone, mais le background-position permet bien de jouer sur le "point de départ" du motif répété.