Change label position for one field to Above

[Jaclyn_Tan1]

Is there a way to change just one field on a form to have the label position be above the checkboxes? For all of our fields, we don't use labels, we just use hint texts and set the field label to the left. But I have a new Checkboxes field that needs a label on the top. I've searched on the Community but haven't seen any CSS that is similar to my issue but am sure it can be done.

[SanfordWhiteman]

You must provide a link to your live form if you want help w/this.

[Jaclyn_Tan1]

Hi Sanford! here's the link: http://solutions.healthcaresource.com/2716-senior-living-demo-days-webinar-series.html

[SanfordWhiteman · Accepted solution]

At simplest, you need

.mktoLabel.mktoHasWidth[for="WebinarSeries2018"] ~ .mktoCheckboxList {
    clear: both;
}

but you'll probably want to work from

.mktoLabel.mktoHasWidth[for="WebinarSeries2018"] ~ .mktoCheckboxList {
   clear: both;
   margin: 8px 0 0 10px;
}
.mktoLabel.mktoHasWidth[for="WebinarSeries2018"] {
    margin-left: 10px;
}

to adjust whitespace.

[Jaclyn_Tan1]

That did it! Thanks for coming to my rescue

[Amit_Jain]

The simplest way to achive what you are try to do is by removing the label for your check boxes as well and add Rich text above these check boxes. Hope it makes sense.

Regards,

Amit

[SanfordWhiteman]

Why is that simpler? Then the label doesn't move with the inputs, making the form setup more fragile.

[Amit_Jain]

It's is simpler in a sense that someone who do not have CSS skill set can make it work easily. I agree that the label won't move with the input but who soever is setting up the form has to take care of it.

[Jaclyn_Tan1]

Someone like me 🙂

I'll definitely use Rich Text in the future for other fields, maybe for T&Cs. Thanks again!

[Jaclyn_Tan1]

Makes sense but we use guided LPs so we can't drop any right text or html onto the LP. CSS just makes more sense for us but thanks for the help!