Share Your Work

CVidaillac
Membre

Change the size of the image gallery on desktop view

Résolue

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:desktop view.png

 

Mobile view:

mobile view.png

 

Thank you in advance.

0 Votes
1 Solution acceptée
Teun
Solution
Expert reconnu | Partenaire solutions Diamond
Expert reconnu | Partenaire solutions Diamond

Change the size of the image gallery on desktop view

Résolue

Hi @CVidaillac ,

 

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



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


Voir la solution dans l'envoi d'origine

7 Réponses
Teun
Expert reconnu | Partenaire solutions Diamond
Expert reconnu | Partenaire solutions Diamond

Change the size of the image gallery on desktop view

Résolue

Hi @CVidaillac ,

 

Try this:

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

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



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


CVidaillac
Membre

Change the size of the image gallery on desktop view

Résolue

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?

Screen Shot 2021-10-05 at 1.28.16 PM.png

 

Thank you

0 Votes
Teun
Solution
Expert reconnu | Partenaire solutions Diamond
Expert reconnu | Partenaire solutions Diamond

Change the size of the image gallery on desktop view

Résolue

Hi @CVidaillac ,

 

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



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


Teun
Expert reconnu | Partenaire solutions Diamond
Expert reconnu | Partenaire solutions Diamond

Change the size of the image gallery on desktop view

Résolue

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.



Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


0 Votes
CVidaillac
Membre

Change the size of the image gallery on desktop view

Résolue
0 Votes
DanielSanchez
Conseiller clé | Partenaire solutions Platinum
Conseiller clé | Partenaire solutions Platinum

Change the size of the image gallery on desktop view

Résolue

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!

 

 

0 Votes
CVidaillac
Membre

Change the size of the image gallery on desktop view

Résolue

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!

0 Votes