Change the size of the image gallery on desktop view

[CVidaillac]

Hi all, 

I'm currently trying to make the size of the images in the image gallery smaller on a desktop view. It looks fine on mobile because the images automatically adjusts, but on desktop it's huge. Is there a way to modify it to look normal?

Desktop view:

Mobile view:

Thank you in advance.

[Teun]

Hi @CVidaillac ,

Try this:

<style>
.hs_cos_gallery {
  max-width: 800px;
  margin: 0 auto;
}
</style>

Change the '800px' to something that works for you.

[CVidaillac]

Hi @Teun, 

Thank you for the code! I'm not familiar with the HTML/CSS, so thank you for your patience. 

I went the DesignTool under that template and I cannot find a way to change the CSS for the Image Gallery Module. Would you be able to help me out?

Thank you

[Teun · Accepted solution]

Hi @CVidaillac ,

Try adding the CSS I shared at the bottom of the file without the style tags (<style></style>)

[Teun]

Hi @CVidaillac ,

Can you share a URL of a preview page so we can do some testing?

Might be able to deliver the CSS you need to fix this.

[CVidaillac]

Hi @Teun , 

For sure, here it is : https://landing.narcitymedia.com/-temporary-slug-8c8d277a-e624-4319-a69d-8775b89dd6d3?hs_preview=vXN...

Thank you!

[DanielSanchez]

Hi @CVidaillac ,

Can you demonstrate how to insert these images on your page? It would be good to see how it is programmed for this.

Either way, you can easily adjust the size by editing your code's CSS, but it requires a basic knowledge of html/css.

Best regards!

[CVidaillac]

Hi @DanielSanchez , 

I used the "Image Gallery" module. 

Is there a specific resource you know to change the CSS to make it desktop friendly?

Thank you!