Skip to Content

Center align a HubSpot form submit button

⚠️ Note that this post hasn't been updated for at least a year and the information may be outdated, proceed with caution! (Last updated: October 31, 2019)

When you add a form module to a template, it'll display a dummy form that has four fields (First Name, Last Name, Company and Email) and a submit button with the text "Get Free Widget".

This dummy form doesn't have a wrapper around the submit button so, unless you set it to display "block", margin "auto" and set a fixed width (which is not ideal), it's tricky to center align it.  

HubSpot form markup

 

However, a live form on HubSpot wraps the button in a div with the class "actions" within another div with the classes "hs_submit" and "hs-submit":

HubSpot live form markup

 

You can add a text-align "center" to either of these classes to center-align the submit button. Adding the following CSS snippet to your stylesheet should do the trick: 

.hs-form .hs-submit { text-align: center; }

←  Previous Article

Style custom checkboxes on HubSpot forms

Next Article  →

Check if blog post comments are enabled on HubSpot using HubL

Contact

Get help from a HubSpot CMS Expert

  • Custom HubSpot themes and reusable and easy-to-use HubSpot templates and modules
  • Technical support and guidance on the HubSpot CMS