Improve Responsive for Landing Pages

Status: Delivered

Status history

Hey @Laura the moduules used in HubSpot’s template builder are responsive by default. These modules work on a flexible grid that automatically adjusts their proportions to fit a viewer’s screen dimensions. This “responsive” system relies on percentage widths and heights to make a smooth transition between devices.

If a module, column, or wrapper changed and set to use fixed widths or heights this responsiveness is broken and different screen sizes are no longer able to fluidly adjust the size of your content to fit the viewer’s environment. As a best practice, to prevent your layout from breaking on mobile devices, any styling on your COS pages for height and width attributes should be done with min/max width in percentage format.

Design Support

If you are using a template from HubSpot’s template marketplace that is not responsive, you will need to contact the original desinger. HubSpot is able to assist with minor edits to templates you having building using the template builder. We also have a a Designer Forum where our community can assist with custom design edits to help you get the most out of HubSpot’s templates and optimize them for mobile.

For more substantial updates, HubSpot offers access to certified HubSpot agencies that specialize in designing on the HubSpot COS as well as more generalized website design services. HubSpot also offers a free COS Designer Certification course to help you gain confidence in making these design edits yourself.

I hope the above information is of help to you. If you have any further feedback please let me know and I will make sure it is passed on to our COS product teams.