Image not showing full width

Hi,

I have an image I want to use at my homepage.
It’s has to be full width and hight to be visually working.

Problem:
I tried putting it in a div block (which is in a container to scale it properly) but it only shows a part of the photo (not full width) on desktop and on screens smaller than desktop it keeps cutting of the edges on the left and right even further.
(If I use it as background image of the section it’s to large, so that’s why i put it in a container/div)

I tried different settings (vh and vw) but none worked…

How do I get my image to show full width/hight?

Best regards Gijs


Here is my site Read-Only: Link

This the published site: https://testinghomepage.webflow.io/

1 Like

Hello @Gijs_1

The image with the lamp?

Piter :webflow_heart:

Yes the image with the lamp :slight_smile:
(There is no other image if I am right)

Try a normal div in stead of the standard container, which its capped at 940 something pixels.Just put the image in there, not as a background image. Set the div at 100% heigh. That will work. Good luck

2 Likes

Here’s @new_work_city idea > https://www.useloom.com/share/4dcf614cd07d4ec2a762cc07220820d5

You can also try with a custom css for the image. Here’s how > https://www.useloom.com/share/510c0c19f25348dcb0aa391146154fce

Here’s the code

<style>
.img-class {
  object-fit: cover;
}
</style>
2 Likes

Thank you @PeterDimitrov and @new_work_city!!

1 Like

had the same problem with setting an image in full width,gonna edit the picture in PS and try this method out , thank you for the hints).