topic Re: Forms - multiple columns for check boxes in Lead Capture Tools

Forms - multiple columns for check boxes

GDFred — Wed, 15 Mar 2017 21:59:00 GMT

If I have 8 items in a check box list in a form, how do I change the configuration from a single column of 8 choices (which takes up vertical space) to 2 columns of 4 items each which is more horizontal?

Re: Forms - multiple columns for check boxes

DaniellePeters — Thu, 17 Aug 2017 16:09:36 GMT

A simple change you could make is to add this to the Head HTML of your page (so that you don't affect forms on any other pages):

<style>
    li.hs-form-checkbox {
        display: inline-block;
        width: 50%;
    }
</style>

The display line lets the checkboxes sit on the same line and the width 50% ensures that there will be two columns as each one will take up half the width.

You can make this more specific to your page/form if needed with additional CSS selectors

Re: Forms - multiple columns for check boxes

gil100 — Thu, 17 Aug 2017 14:17:46 GMT

From some odd reason it removes the background from the page I'm working on, it there a way to apply formatting just to the form itself (I'm using Hubspot CMS)

Re: Forms - multiple columns for check boxes

DaniellePeters — Thu, 17 Aug 2017 16:11:29 GMT

I noticed there was an error in my original post which I have now fixed with the closing style tag being a regular style tag (<style> instead of </style>). So if you copied it directly, that may be causing issues.

Re: Forms - multiple columns for check boxes

TTreeCare — Wed, 03 Nov 2021 00:59:37 GMT

It is not working