Streaming live at 10am (PST)

Center scaling image in div issue

I really want a full width container that has two 50% divs where left is an image that fills the whole div space but that div space adjust when the div right has text. So basically I want both divs left and right to always have the same height and the image on the left div to stay centered and scales to fill left dive until a break point.

I have tweaked it as much as i can but maybe i am doing something wrong. I now have it as a background image but the example below where the people are in the picture on the left side is not a background image and just a regular placed image. Not sure how to do this in webflow. the text on the right makes the full width container stretch and the image adjust.

http://yessbody.com/home.php


Here is my site Read-Only:

https://preview.webflow.com/preview/wwt-hou?utm_medium=preview_link&utm_source=dashboard&utm_content=wwt-hou&preview=03cfc1d60009549acfd0fe95eb343d39&mode=preview

No way to do so (Frame proportion have to change to match the right text col - and the bg-image inside set to cover).

One solution is to use extra space around the image (In your case the faces overflow). Second is to use diff image on tablet. Last option is do not use a lot of text for the right col (Or resize the text).

For regular images use one line of custom CSS code object-fit: fill;; - Example of tutorial related (In your case no need for the aspect ratio only for object-fit):

Out of box: Add overflow:scroll" for the text (Not so elegant but also solution).

Ok thank your for your fast response.