Landing Page - mobile responsiveness (margins and padding)

New Contributor

Hello!

Is there any way where the changes made in padding/margin styles are not reflected in mobile devices? My landing page is looking OK in desktop with margins changes, but unfortunately these changes look all mixed up in mobile:

https://tech.sun-evo.com/?hs_preview=brhahdJo-21053451397

 

Since HubSpot landing pages require some advanced knowledge in coding, I kindly ask for your help!

 

Thank you,

Filipa

Reply
0 Upvotes
3 Replies 3
Regular Contributor | Gold Partner

Hi @digitalfilipa - I'm looking at a few layout issues on your site for mobile; here are some tips on how to fix them:

 

Hero:

Screen Shot 2020-01-28 at 11.08.32 AM.png

 

 

How to fix:
New Contributor

 

I highly appreciate time you took looking at this!

First issue is solved, thank you 🙂

 

Removing the margins is suitable for mobile, but there is too much space between the modules/elements in desktop version. Here is a prevew link of the icons module with -50px top margin:

https://app.hubspot.com/content/6357974/edit/21053451397/preview

 

Do you have any suggestion to remove spaces without making changes in the margins?

 

 

Thank you so much once again

 

Best,

Filipa

 

Reply
0 Upvotes
Regular Contributor | Gold Partner

A media query will most likely be required to only apply the styling on mobile screensizes - if you'd like, shoot me an email to set up a quick video chat and we can knock this out: droma@driveagency.co

 

Reply
0 Upvotes