Checkbox display/styling issues

  • Resolved vonJanne

    (@vonjanne)


    5 years, 10 months ago

    Hi!

    I have a question regarding the field type “checkboxes”. At the end of my form I have three checkboxes; two come from “outside” (newsletter sign-up and data protection). The third one (the first one you see on the page which I linked to – just below the “Website” field) I added via the form editor, and I am wondering: How can I make the checkbox itself sit BELOW the label, so that it doesn’t move out to the far right? (If I don’t give the labels a width, the newsletter checkbox label turns very narrow … :-/)

    Thanks!

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • You will need to target both the label and the input for that in your theme’s stylesheet.

    From the top of my head, something like :

    .em-booking-form input[type=checkbox], .em-booking-form input[type=checkbox] label {
display: block;
}

    On my own website I have actually styled it that the checkbox is in front of the label. Was more logical for Dutch Users. Unfortunately I cannot get to that code until Thursday, so if you want that, please wait a few days. ??

    Thread Starter vonJanne

    (@vonjanne)

    Hi Patrick,

    Thanks – I’d love to see how you did that, so I’ll wait for it! In the meantime I have settled for reducing the margin-left:120px on .em-booking-form span.input-group so that at least some of the text looks normal. ??

    Cheers!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Checkbox display/styling issues’ is closed to new replies.