COS-General

How can I adjust the size my social media icons on mobile?

Last updated: December 4, 2017

Available For:

Marketing: Basic, Pro, Enterprise
Sales: N/A

Learn how to adjust your CSS if you notice your custom social media icons are enlarged when viewing your page or email on mobile. 

 

 

  • In your HubSpot Marketing account, navigate to Content Landing PagesWebsite Pages, or Email
  • Locate and hover over your page or email and click Edit
  • If you're adding your social media icons using a Custom HTML module, access the module for editing. If you are using a Rich text module, click into the module then access the source code using the <> button. 
  • Find the code for your social media images. Here, we will add a max-width and width that matches the size of your images. To find out the size of your image, please reference this article. You'll want to replace the values here with your image's width and URL:
<img style="max-width: [width of img from file manager]px;" width= "[width of img from file manager]" src="[file URL]">
  • Here is an example:
<img style="max-width: 32px;" width= "32px" src="http://www.stylebidder.com/hs-fs/hub/408526/file-1178523313-png/fbround.png">

Was this article helpful?