Forms 2.0 CSS for hidden field

Anonymous
Not applicable

Forms 2.0 CSS for hidden field

Hello!

I'm new to the CSS world and have a challenge where I need the text of a hidden checkbox field (displayed by visibility rules) to align better with the rest of the form. In the image below, the text is off and while I have tried adjusting the label/field width, it doesn't work. In terms of CSS for the form, is there a recommended code to adjust only that field so that it's a bit more centered and the checkbox is inline with the rest of the text?

pastedImage_2.png

2 REPLIES 2
SanfordWhiteman
Level 10 - Community Moderator

Re: Forms 2.0 CSS for hidden field

URL, please. Can't troubleshoot a screenshot.

Also, just to be precise: it can't be Hidden (that's an actual, mutually exclusive field type) if it is governed by Visibility Rules. "Conditionally displayed," maybe....

SanfordWhiteman
Level 10 - Community Moderator

Re: Forms 2.0 CSS for hidden field

Don't know what alignment you're going for ("a bit more centered" isn't enough), but you can start restyling your particular form with this:

.mktoFormRow .mktoHasWidth[for="Unsubscribed"] {

   width: 250px !important;

   float: right;

}

.mktoFormRow .mktoHasWidth[for="Unsubscribed"] ~ .mktoCheckboxList {

   margin-top: 6px;

}

.mktoFormRow .mktoHasWidth[for="Unsubscribed"] ~ .mktoCheckboxList input {

   margin-left: 12px;

}