Solved SP Page Builder

Checkboxes Overlapping Text / Not Clickable

Asked by Jacob Vicars 3 years ago Last activity 3 years ago

Hello, I'm having an issue with checkboxes overlapping the text on our template.
[http://2022update.awaken.church/index.php/bethechurch/familydedication]

Accepted answer

Marked as the solution

Rashida Rahman Staff

3 years ago

Hi,

You can use this also:

.form-builder-checkbox-item label::after, .sppb-addon-form-builder .sppb-form-check-label::after {
    left: -27px;
}
label.form-builder-checkbox-label{
    transform: translateY(0px);
}

Best Regards

4 more replies

Rashida Rahman Staff

3 years ago

Hi there!

Sorry for your issue.

Please use the following code in your custom CSS:

#sppb-addon-1671686649318 .form-builder-checkbox-item label::before {
    margin-left: -20px;
}
.form-builder-checkbox-content label {
    margin-left: 50px;
}

Hope this will give you better view there!

Note: Path towards custom CSS(Joomla 4): System>Site Templates Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

https://prnt.sc/5mBuSRh907N3

https://prnt.sc/ooiq-lkMEXr_

https://prnt.sc/nunlX-f5AhK1

Best Regards

Jacob Vicars Asked this

3 years ago

Thank you! that did help with the formatting, however, i'm still having issues with checking the boxes... for some reason the first three won't check at all, and the others now fill instead of showing a checkmark. (I also changed the sizing a little bit)

#sppb-addon-1671686649318 .form-builder-checkbox-item label::before { margin-left: -30px; } .form-builder-checkbox-content label { margin-left: 70px; }

Jacob Vicars Asked this

3 years ago

that was it! It's working now!

Rashida Rahman Staff

3 years ago

Glad that it helped:)

Have a nice day!