Streaming live at 10am (PST)

Rich text. How to make images wider than the text

Hi there,

I am creating a blog page and I want the images inside the rich text to be wider than the other elements (headings, paragraphs, quotes).
In the Webflow blog posts you can take a look how it should look like: https://webflow.com/blog/web-design-inspiration

I tried to edit the image width with a value greater than 100% but doesn’t work. Any ideas?

Thanks in advance


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Using a value above 100% should work, just make sure you offset the image to the left half the amount to increase it by (ex: 10% left if the image is 120% wide). If you’re not seeing the change then you probably have another style prevent it from taking effect.

If you can’t get it working, please share your read-only link and I’d be happy to take a look into it.

@mikeyevin thanks for your answer.
I can’t seem to get it to work… If you could take a look at the read-only link I would appreciate it.
https://preview.webflow.com/preview/vilasearch?utm_medium=preview_link&utm_source=designer&utm_content=vilasearch&preview=13e290c52eb3e3a2dc390959f071c9af&pageId=5e97a8783fc8a7bf9627545b&mode=preview

Thanks in advance!

Ah, it looks like there are some settings within the RTE image position/size that are conflicting with the width property, but I was able to get it working by using the min-width property instead:

image

Keep in mind that I applied this to the containing figure element nested within the rich text element and made sure the image stretched 100% of the width. Hope that helps!

2 Likes

Wow! Thank you @mikeyevin!
It works perfect now. I owe you a beer!

Regards

1 Like

Glad I could help out!