I’m trying to use some imagens inline with text. I used HTML () +Rich Text. It works if the image is alone on a line, but it does not work if the image has any text before or after it.
Any ideas?
Thanks.
So in your example, would the image be smaller like the “top” image, and be something like: “With text before [image here] or after it…” on the same line?
<div style="display: flex; align-items: center;">
<span>This is some text before the image</span>
<img src="https://img.icons8.com/ios-filled/50/yin-yang.png" style="height:25px;margin:5px">
<span>and this is some text after the image.</span>
</div>
1 Like
Thanks for your answer! It works… but I don’t know why, the lines are split in 2.
I just copy/pasted your code as it was.
Weird, can you show me your setup?
I’m quite new to glide, what info do you need?
This is called a wrapping issue, where your text is too long, causing it to wrap downwards, along with the text-alignment issue that defaults to left alignment. Try adding style="text-align:center;" inside your span tag, which will make the spacing of your text more evenly centered around your icon.
Do you see the problem in your screenshot on desktop or mobile?
Mobile.On desktop it works with that amount of text, but if you put more text before or after the image, the same thing will happen.
What do you expect from your text when the screen size is not enough to accommodate it?
I expect it to continue to next line, not to make 2 lines of text before/after image.
<div style="width: 100%; white-space: normal;">
This is some text before the image
<img src="https://img.icons8.com/ios-filled/50/yin-yang.png" style="height: 25px; vertical-align: middle; display: inline;">
and this is some text after the image.
</div>
3 Likes
This worked like a charm! Thanks!!
1 Like
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.