Bienvenue, Invité
Nom d'utilisateur : Mot de passe :


I have developed a range of add-ons for webtrees available only from my kiwitrees.net web site: kiwitrees.net/simpl-add-ons/. For any queries related to those items contact me direct from that site.

SUJET : Want image in the middle, not hanging from the top

Want image in the middle, not hanging from the top il y a 6 ans 9 mois #1

  • WGroleau
  • Portrait de WGroleau
  • Hors Ligne
  • Gold
  • Messages : 1520
I am using simpl_grey. At one time I had customizations but I reverted to "stock."

But I have been trying some new customizations today, with no success.

I've uploaded at least ten versions of the style.css to try to make the image in the random media block centered vertically as well as horizontally. None of these changes have had any effect.
--
Wes Groleau
UniGen.us/
PHP 7.2.15; MySQL 5.6.40; Apache
Dernière édition: il y a 6 ans 9 mois par WGroleau. Raison: typo
L'administrateur a désactivé l'accès en écriture pour le public.

Want image in the middle, not hanging from the top il y a 6 ans 9 mois #2

  • kiwi
  • Portrait de kiwi
  • Hors Ligne
  • Platinum
  • Messages : 4949
Hi Wes.

Good luck with that one! I've probably tried every way I can think of already.

Vertically centring images is ALWAYS difficult, but impossible if you don't know what size it's gong to be. That's because the only solution I've found that works is to add padding top & bottom equal to half the difference between the image height and the container height.

My new "simpl_slideshow" variant of that block gets one small step closer, by fixing the height (and width) of the container, but it's still not possible to vertically centre the image.

There is actually one way, but not one I can be bothered working through. That is to use javascript, and calculate the padding for each image 'on-the-fly'. It should be possible, but I don't believe the extra resource required to do it for every image is worth it.

Of course, if you keep all your images to a constant height, then there is no problem at all :-)

But the current thumbnail creation only constrains the image width.

But if you find the answer (in css) let me know :-)
Nigel

www.our-families.info

Hosted at:
Follow me at:
L'administrateur a désactivé l'accès en écriture pour le public.

Want image in the middle, not hanging from the top il y a 6 ans 9 mois #3

  • WGroleau
  • Portrait de WGroleau
  • Hors Ligne
  • Gold
  • Messages : 1520
Hmmm. I've seen HTML <td valign="middle"> do it so I don't know why CSS vertical-align:middle wouldn't.
--
Wes Groleau
UniGen.us/
PHP 7.2.15; MySQL 5.6.40; Apache
L'administrateur a désactivé l'accès en écriture pour le public.

Want image in the middle, not hanging from the top il y a 6 ans 9 mois #4

  • kiwi
  • Portrait de kiwi
  • Hors Ligne
  • Platinum
  • Messages : 4949
The clue is in your comment "<td valign="middle"> ".

valign, and it's css equivalent vertical-align only work on table cells.
Nigel

www.our-families.info

Hosted at:
Follow me at:
L'administrateur a désactivé l'accès en écriture pour le public.
Propulsé par Kunena