Side by Side Images Responsive While Using CMS Rich Text Field

Design help General
1

I would like two images to be responsive and stay side by side until a certain breakpoints using the CMS and a rich text field. When I try to resize them at tablet they stack and do not look good. I tried using a defined Pixel size as well as a % of container setting.

Below is an example of the issue I run into.

unnamed
unnamed2518×1212 550 KB

unnamed
unnamed1319×1049 149 KB

Basically, I want to have a blog like a post for each of my projects with some images being side by side for comparison or layout purposes.

I have reached out to support and this is the workaround they recommended. First solution is what I am struggling with and there was a new proposed solution at 3:30

https://cl.ly/1Y1J420v331f

While it works it can be cumbersome especially if certain posts are not following the same layout and it causes it to be clunky.

Example Project pages to view should be Northwestern Medicine

Here is my site Read-Only: https://preview.webflow.com/preview/nicholasphillips?preview=12c7fd2ac10cc25335ad0376d4fcd234

2

@Nicholasdaniel93, my thoughts would be to create a page that has styles on it only and create Rich Text Styles for everything including image placements. Here is a link for Rich Text Styling: Rich text element overview | Webflow University

See if that helps with your struggles. Beyond that I would reach out to @Waldo for additional support.

3

Hi @Nicholasdaniel93

At this time the rich text field doesn’t have the sort of image styling you are looking to achieve. I think splitting the post up into two separate posts and using columns (or a custom column build) in between the two halves of the post is the best way to achieve this if you want this higher level of control.

The other option would be to use smaller % sizes when adjusting the width of the images in the rich text field, but this won’t give you as much stylistic control.

Best of luck with this design and I hope my recommended solution helps :bowing_man:

4

FYI even Mailchimp can handle something like this. Client doesn’t get why he or I can’t make two images side by side on the website CMS collection page. Webflow seriously needs some help here… this is just a basic client (and designer!) expectation. Having to “hack” it doesn’t make sense, when blog posts/newsletters are going to have different formats always. Going to check the wishlist for this, but this is kind of a no-brainer.

5

Can you explain this in more detail? Are you saying in the CMS I have

Rich Text 1
Multi Image 1
Rich Text 2
Multi Image 2
Rich Text 3
Multi Image 3

And, hope the client doesn’t want any more than 3 sections in their post? And, if there is only 1 image in “Multi Image” it stretches? Or…? So unclear. Thanks!