Position & alignements !

Citation:

---

Envoyé par Casio

...les marqueurs antenne ne sont pas précis comme ceux des bénévoles.

---

Pour revenir à ta question.

Il faut comprendre que les top/left que tu indiques correspondent au point en haut à gauche de chaque image (point vert) :
Pièce jointe 602851
Si tu veux les positionner correctement :

• au centre sur les "W" (dimensions : 20 x 20px) -> ajouter transform:translate(-10px,-10px);.
• au milieu-en bas sur les "map" (dimensions : 20 x 32px) -> ajouter transform:translate(-10px,-32px);.

Et niveau code, comment faire ?

J'ai l’impression que tu te disperses un peu quand même :mrgreen:

Comme il me semble l'avoir souligné, voir ma réponse, ll te suffit de rajouter une largeur en pourcentage pour que ton exemple test, post #1, devienne cohérent.

Comme les images de tes « marqueurs » et tes « POI » ont la même largeur, tu peux ajouter directement dans le CSS la largeur en %

Code:

---

1 2 3 4

#France img { position: absolute; width: 5.263157894736842%; /* (20 / 380) *100 */ }

---

Ensuite on pourra effectivement discuter de ce que tu souhaites réellement mettre en place et la façon de faire la maintenance, mais pour le moment je ne sais toujours pas ton choix final, image fixe ou adaptable !?!

Le but en effet, c'est que cela soit responsive.

Et si a terme je dois changer la taille, que cela ne me force pas à tout refaire.

Citation:

---

Envoyé par jreaux62

Pour revenir à ta question.

Il faut comprendre que les top/left que tu indiques correspondent au point en haut à gauche de chaque image (point vert) :
Pièce jointe 602851
Si tu veux les positionner correctement :

• au centre sur les "W" (dimensions : 20 x 20px) -> ajouter transform:translate(-10px,-10px);.
• au milieu-en bas sur les "map" (dimensions : 20 x 32px) -> ajouter transform:translate(-10px,-32px);.

---

Cela devient de pire en pire :-(

-=> https://wda-fr.org/index.php?page=../test/carte-inter

Bonjour,

Je t'ai présenté des solutions possibles.
NoSmoking t'en a présenté d'AUTRES.

Ne mélange pas tout.
Choisis d'abord TA solution.


N.B. on n'a pas les adresses.
On ne peut pas savoir si tes points sont bien placés ou pas.