L'Agora sur Chronica – C'est rigolo le css, mais ya parfois des effets de bord...

Re: C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (Katryne) — Thu, 08 May 2025 05:56:24 +0000

J'ai essayé autre chose : sans redimensionnement, j'ai mis les mêmes borders et margins CSS en admin que côté public. Mais c'est pas encore ça : quand je trace les cadres, je dessine à côté. Dans 12 ou 15 ans, j'arriverais peut-être.

Re: C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (Katryne) — Fri, 25 Apr 2025 11:20:07 +0000

Faudrait juste que je prenne l'habitude de calibrer mes photos AVANT l'upload. Je n'ai qu'une dizaine de photos taguées, mais ce fut long à faire. Et j'en ai encore quelques unes en attente. Bon, je vais démonter mes fioritures.

Re: C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (MichelKirsch) — Fri, 25 Apr 2025 10:06:21 +0000

Si l'image est réduite à 60%, il faut que les "coordonnées" des rectangles d'étiquettes soient redimensionnés de la même façon...
Bon courage ! :-)

Re: C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (Katryne) — Thu, 24 Apr 2025 13:59:53 +0000

Je n'y arrive pas Éric; merci de la suggestion. Si j'applique le css de redimensionnement sur #imgviewer, l'image n'est pas redimensionnée, elle s'équipe d'un scroll latéral et les étiquettes sont toujours dans les choux.

J'ai essayé successivement avec :
#imageviewer
div#imgviewer
div#imgviewer div#imageviewer.canvas

Ya que
div#imgviewer div#imageviewer.canvas img#theimage

qui redimensionne la photo.

Re: C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (Eric) — Thu, 24 Apr 2025 12:54:23 +0000

Bonjour,
As-tu essayé de redimensionner #imgviewer et y ajouter un padding plutôt que de redimensionner l'image ?

Re: C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (Katryne) — Sat, 19 Apr 2025 09:41:07 +0000

Il ya pas que le redimensionnement des images (60% max) qui influe sur l'affichage des tags à la bonne place, ya aussi l'encadrement (border et box-shadow et padding et margin)

#theimage {margin-top:1rem;padding:1rem !important;border: 1px solid rgb(40, 43, 117); box-shadow: 0 0 0 5px #2a2d7a inset, 0 0 0 6px rgba(255, 255, 255, 0.6) inset, 0 0 40px #14153a inset, 0 10px 15px -10px rgba(0,0,0,0.6) !important;max-width:95%;}

Bon, je préfère garder mon décor et abandonner les tags, c'est dommage pour les photos de mariage. Ce n'est pas envisageable de refaire les étiquettes en fonction d'une image "encadrée", puisque en admin, c'est sur une image brute que l'on dessine les tags.

C'est rigolo le css, mais ya parfois des effets de bord...

null@example.com (Katryne) — Fri, 18 Apr 2025 10:02:39 +0000

Salut la compagnie !
Je trouvais que les très grandes images prenaient trop de place sur la page (showmedia.php). Et parfois aussi que les trop petites images étaient ridicules au milieu de la page, Alors j'ai indiqué en css que je les voulais toutes en 60 % de large, pas plus pas moins, avec ça :

div#imgviewer div#imageviewer.canvas img#theimage {margin: 1rem auto !important;width:60%;max-width:60%;height:auto;}

C'est tout beau, pas déformé, comme je veux, sauf que dans la bataille, j'avais oublié les étiquettes de nom qui se sont toutes envolées, pour se recoller ailleurs. Va falloir que je retravaille ça. Et peut-être que ce sera pas possible car je ne saurai pas prendre en compte le script des étiquettes.

Voilà le beau résultat.