Hello all,
I’ve installed Featherlight and it works almost as I expected. The problem is, for many pictures I’d like to add a caption that doesn’t fit under the image. When it’s longer than the widht of the ‘canvas’ Featherlight makes the image as wide as the caption is.
When in use with the plugin Image-caption, I can’t find a way to display the title as caption.
What I’m doing wrong, or is there a solution to implement?
Thanks for your reaction, comment!
Kind regards,
Galileo
@Galileo, Do you perhaps mean plugin FeatherLight?
Oops… sorry. Yes, it’s FeatherLight. I’ll change the topic title. Thank you Pamtbaau
pamtbaau via Grav Community Forum notifications@getgrav.discoursemail.com schreef op 15 augustus 2025 20:43:55 CEST:
@Galileo, By default, <figure> is a block element and will take the entire width given by its parent container.
The <img> is displayed using its own width and the <figcaption> will take all it gets from the parent container.
What is not working the way you expect it to work?
I’d like to see that a caption of two lines, that doesn’t interrupt the width of the image. Especially for vertical images. I’ve tried the solution as mentioned in Github Clarification on captions · Issue #34 · getgrav/grav-plugin-featherlight · GitHub and in de Grav documentation of Featherlight, but than the caption isn’t visible, only with the then added scrollbar which I don’t like.
I was thinking of two div’s. One for and nested one for <figure.caption>. But I don’t know where to place the code and if it will work. I think the height of the is given and the width is auto.
Check out this video:
Thank you Karmalakas, interesting video. I’ll see if can implement it in the css.files of FeatherLight and I’ll come with an update of this thread.