• Resolved goldcoastpickleball

    (@goldcoastpickleball)


    Someone has tried to complete the form and had trouble clicking the check boxes. They used to show a tick and no longer do. I have tried selecting the check box in the form backend but it does not show on the web page form.

    Thank you

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

Viewing 1 replies (of 1 total)
  • Hi @goldcoastpickleball,

    Thanks for reaching out!

    I took a look at the form and I believe I see the issue with the checkbox/radio button styling. The WordPress theme is changing the browser’s default appearance for checkbox/radio button inputs and that’s conflicting with WPForms styles.

    To address this, we need to make some small CSS tweaks, which I’ve included below:

    
    .wpforms-container input[type=radio] {
    	-webkit-appearance: radio !important;
    	-moz-appearance: radio !important;
    	appearance: radio !important;
    }
    
    .wpforms-container input[type=checkbox] {
    	-webkit-appearance: checkbox !important;
    	-moz-appearance: checkbox !important;
    	appearance: checkbox !important;
    }
    
    .wpforms-container input[type=radio]:checked:before,
    .wpforms-container input[type=radio]:before,
    .wpforms-container input[type=checkbox]:checked:before,
    .wpforms-container input[type=checkbox]:before,
    .wpforms-container input[type=radio]:checked:after,
    .wpforms-container input[type=radio]:after,
    .wpforms-container input[type=checkbox]:checked:after,
    .wpforms-container input[type=checkbox]:after {
    	display: none !important;
    }
    

    In case it helps, here’s a tutorial on easy ways to add custom CSS like this to your site.

    I hope this helps! Could you please let me know if I can clarify any of the information above or provide you with more details?

    Thanks!

Viewing 1 replies (of 1 total)
  • The topic ‘Cannot see tick for check boxes’ is closed to new replies.