I ran into the same problem alicel22 posted about, where I’m getting a 5px space between the bottom of an image and the edge of the containing div. Alex S had provided some suggestions, but he didn’t sound hopeful and that was the end of that thread.
I checked on Stack Overflow and found a solution that appears to work.
According to the Stack Overflow explanation, the space is because the img tag has the default display: inline style, which causes the div to reserved some space at the bottom for descender elements (e.g. g, y, j). Changing the img tag style to display: block fixes the problem (the image in the image widget is now flush with the bottom).
I’m all set as I’ll add the style as some custom CSS. I’m posting the solution in case someone else is having the same problem.
Rich
Hi Rich,
I’m glad you were able to resolve this issue. I’m sorry I wasn’t able to be of assistance this time. You were correct about the linked thread – I didn’t think my reply was going to help and I needed more information to proceed. Please be sure to post another thread if you have any other questions.
Hi Alex,
Thanks for replying. One other note about the gap below an image – I was playing with the generic image widget before and that styles the image as display: inline. I’ve since tried the Site Origin image widget and that styles the image as display: block (a better widget).
And thanks for making Vantage, Page Builder, the CSS editor, and the Widgets Bundle available.
Rich