28172 sujets

CSS et mise en forme, CSS3

Bonjour a tous,

J'ai une page web avec cette structure.

upload/18913-html.jpg

J'ai mon div corps avec une image de fond dans mon CSS.
Je voudrais rajouter au dessus des images comme sur le schéma mais je n'arrive pas a les positionner.
Si je les mets en position relative en px, dans mon navigateur lorsque je le redimensionne les images ne sont plus à leur place.

Comment puis je faire pour positionner chaque image par rapport a l'origine du div corps.

la page est visible a cette adresse avec le css:

http://lkadiss.free.fr/web

Merci à tous.
Positionnement en absolu, mais ce n'est pas très flexible.

Sinon en float, avec des marging-top et left pour positionner en hauteur et par rapport à l'image précédente. Mais là encore, en cas de redimensionnement ça risque de sauter.
Bonjour,

http://openweb.eu.org/articles/initiation_absolue
À lire attentivement, bien entendu.

Bonne continuation. Smiley smile

(Yasashii, s'il s'agit de placer des éléments de dimensions connues dans un conteneur de dimensions connues, le positionnement absolu est tout à fait adapté. Il est vrai qu'en règle générale on l'évite pour ne pas se retrouver avec des éléments qui ne sont plus pris en compte par leur conteneur ou les éléments adjacents, mais dans ce cas précis ça devrait aller.)
(Florent : Oui, mais je suis toujours un peu prudente avec le positionnement absolu, je n'ai pas dit que c'était une mauvaise solution, juste qu'elle était peu flexible)
merci pour vos réponses...

en fait si je mets en position absolue j'ai un problème lorsque je redimensionne ma fenêtre, ça se décale...

par contre j'ai essayé de mettre mon div corps en relatif et les images en absolu...dans ce cas ca fonctionne mais j'ai un bug sous ie6 car le header se décale comme sur l'image suivante...http://lkadiss.free.fr/web/ie6.jpg

j'ai essayé aussi de mettre un conteneur mais ca ne fonctionne pas.
Je ne sais pas comment faire...
kadiss a écrit :
par contre j'ai essayé de mettre mon div corps en relatif et les images en absolu...

C'est bien de cela que je parlais en parlant d'utiliser le positionnement absolu. Positionner un élément en absolu sans référent positionné est quand même beaucoup moins intéressant.

Pour le bug IE6, l'image n'est pas visible (erreur 404) et je n'ai pas d'IE sous la main.