How do I prevent my image from stretching when in a div block?

Hi there!

I placed my image into a div block because I wanted to place text and buttons over the image. Although, when I preview the layout on my MacBook 15 in, the screen becomes wider than the design screen and my image stretches. How do I make the image/div block responsive by making the image scale-up rather than stretch wider? Is it possible to make the image scale down in tablet/mobile instead of having the div block close up on the image like a window?

I want it to stay looking like this:

But when I preview it looks like this:


Here is my site Read-Only: https://preview.webflow.com/preview/dr-kevin-long-diep-o-d?utm_medium=preview_link&utm_source=designer&utm_content=dr-kevin-long-diep-o-d&preview=1c13b3c39835d4518466a57e79755415&pageId=5d473cb73a861d4d838a85ae&mode=preview
(how to share your site Read-Only link)

you should set the centering of the image and also change it to either “cover” or “contain” like so:

if you want it to fit all the parts that you have in your picture you have to have a differently cropped image…