28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous !

J'ai à vous exposer un besoin que j'ai, que je veux mettre en place pour me faire gagner du temps pour l'ajout de nouveaux textes et images sur mes nombreuses pages web déjà écrites, avec des tableaux, et mise en pages déjà faite, et que je n'ai plus envie de modifier à nouveau pour y ajouter ces dernières modifs que je dois faire.


Mon idée au départ était de placer des calques sur ces pages web, aux bonnes zones indiquées pour ne pas à avoir à réécrire mes tableaux qui sont déjà millimétré et que j'ai n'est pas du tout envie de remofier.

En fait, je veux ajouter sur mes pages de résulat de fiches produit, j'ai envie d'y ajouter l'image "News" ou encore "Promo" ou encore "En stock", etc...

Mon logiciel serveur se chargera d'y placer ces logos quand il le faudra.




Mais voilà le problème : Un calque ne peut être placé à un endroit, que par une seule façon : donner les repères X et Y en partant de la base haut et gauche de la page web.
Sera à 200 pixels et 300 pixels de haut et de droite de la page web.

Mais chez moi, le souci, c'est que j'affiche les résultats les uns en dessous des autres, tous se suivent.
Mon logiciel serveur fonctionne comme ceci : Si je lui dit d'afficher en réponse 20 produits, le logiciel va dupliquer sur le serveur 20 fois la zone HTML concernée pour qu'ainsi ça donne pour le visiteur une page web qui contiendra une liste de 20 produits à la suite.
Mais chaque produit contient différentes informations, ce qui fait que les 20 zones de réponses sont toutes de tailles différentes.

Et donc vous le comprenez, je ne peux pas dire :
Calque 1 sur Produit 1 : X 200 Y=300
Calque 2 sur Produit 2 : X = 200 et Y=600


On me dit pour le moment que la fonction que je cherche à faire n'existe pas !

Peut-on définir un calque et lui dire par un script :
Ce calque appelé Z sera placé à X = 200 Y = 300 MAIS CE BASER comme point de référence sur l'image contenue dans la même page web appelée image Z

Mais ne pas se baser sur X et Y comme point de référence le haut gauche de la page web.
Mais ce calque se basera sur X et Y d'une image. (ou d'un tableau, où je ne sais quoi d'autre qui pourra vous aider à ce que ça marche)


Voilà voilà, je pense, que tout ceci vous à permis de voir le problème.
Dites-moi si j'ai raison, et que donc cette fonction proprement dit n'existe pas dans nos logiciels de dev web.
Et j'espère qu'on arrivera à trouver un moyen de contrer ce problème.

Tout ceci m'évitera de modifier 300 fois mes tableaux dans les pages de mon site.
Ainsi le script réalisé dira de ce baser sur les images présentes à raison de 20 images placées dans la page, et donc incluses dans chaque fiche produits mise en réponse dynamiquement.
(vous comprendrez en allant voir une exemple de page)

Voici un lien exemple :
lien exemple
(Je veux me baser sur les images de produits comme point de référence)

Merci de votre aide !
A très bientôt.
Modifié par Florent V. (29 Oct 2007 - 10:13)
Bonjour,

Pour commencer, je déplace ce sujet dans le salon CSS, vu qu'il ne s'agit pas ici (ou alors marginalement) de syntaxe HTML mais bien de positionnement CSS.

Ensuite, je n'arrive pas à visualiser ce que tu souhaites faire, et sur la page que tu indiques je ne vois pas d'images produit (à priori elles ne se chargent pas et c'est le texte alternatif qui est affiché à la place). Mais on peut tout de même remettre à plat une ou deux choses:

1. Les «calques» n'existent pas en CSS. Je suppose qu'il s'agit d'utiliser des éléments positionnés en absolu?

2. On n'est pas obligé de donner les coordonnées exactes d'un élément positionné en absolu. On peut le laisser à sa place «normale» dans le document. Sans doute faut-il creuser par là?

Révisions sur le positionnement absolu:
http://openweb.eu.org/articles/initiation_absolue/
http://web.covertprestige.info/test/12-positionnement-absolu-selon-conteneur.html

Bonne continuation. Smiley smile


PS: la mise en page est mise à mal sous Safari et Opera.