CSS Grid - Images different when published

Design help General
1

I have used CSS Grid on the page ‘Ísland Lodge’. In the designer it looks exactly how I want it to, but once published to the webflow sub-domain or in preview the image to the left is too small. Can anyone advise me how to rectify this please? Is CSS Grid the right solution for what I am trying to achieve or is there a better way? Many thanks guys.

Here is my site Read-Only: https://preview.webflow.com/preview/lhsl?utm_source=lhsl&preview=252881c5135309ec05d7f8a96add3762
(how to share your site Read-Only link)

2

Hi @Roxzfr

Yes, Grid is perfect for the design you’ve created.

Now about that image, It seems you’ve set a width for that image in the image settings:
CloudApp

Just remove that width setting.

Also, to make sure your images fill the whole space on larger devices, make sure to set the width to 100%
CloudApp

Hope this is helpful. If you have any other questions, please don’t hesitate to reach out and I’ll be glad to help.

1 Like
3

Thank you so much @AnnaKelian - it’s always something simple that I don’t even think of! Great advise and have a lovely day :slight_smile:

1 Like
4

You’re most welcome @Roxzfr. Those tiny details can be sneaky!

Have a lovely day yourself :relaxed:

1 Like
5

Hi @AnnaKelian, I am so sorry to bother you. If you have time would you mind taking a look at the Pond Lodge Grid as this has a similar issue with the 4 small images. I managed to solve the two closest to the large image by setting width and height to 100%, when I do this with the two images on the right they collapse. I can’t see that I have done anything different to Island lodge. If you don’t have time please do say I can just create a new topic. Thank you in advance

6

Hi @Roxzfr

100% height doesn’t work the same way as the width for images. Instead, to make the images stretch and fill the cell, select the grid and set the vertical alignment of the children to stretch again.
CloudApp

1 Like
7

Thank you @AnnaKelian - you are a complete star! Have a lovely weekend.

1 Like
8

You’re welcome @Roxzfr! You too, have an amazing weekend!