How do I make my image responsive?

Last updated: November 7, 2016

Available For:

Product: HubSpot Marketing
Subscription: Basic, Professional, & Enterprise

By default, images in HubSpot-migrated templates and HubSpot theme templates will be responsive.  However, if you find it necessary to implement additional CSS to ensure that your images remain responsive across mobile devices, you can add the following example CSS, adjusted as needed for your custom classes / module IDs, to your page's stylesheet:

img{max-width: 100%; height: auto;}

For instructions on finding the stylesheet attached to your page, check out this article. This CSS will tell the browser or email client to adjust the width of the image to the size of the screen its on, and also adjust the height to be relative to the width.

If you are not comfortable using CSS, it is highly recommended that you work with a designer to style your pages. You can find designers in the Partner Directory here

Was this article helpful?