Display one under the other

[NiallD1991]

Hey guys,

I’m struggling with the CSS on CF7.

How do I make these checkbox items display one on top of the other?

I can’t seem to figure out the correct selectors using the developer tools.

Thanks in advance!

[marc_a]

Hi Niall,

Thanks for reaching out.

Please check this article on how to make your checkbox display single lines.
https://sundari-webdesign.com/contact-form-7-checkboxes-in-single-lines/

Hope that helps.

Thank you.

[NiallD1991]

HI @cramaton

Sorry, I guess I wasn’t clear. I understand the process for the link.

My issue is targeting that specific set of boxes. I cannot find the right selector for that specific field

[marc_a]

Hi Niall,

please use this selector, please check the screenshot below.

Hope that helps.

Thank you

[NiallD1991]

Sorry but it still doesn’t. I can’t figure out what’s going on…
I’ve tried using !important too.

[marc_a]

Hi Niall,

I gave you the link on how to have a single line checkbox, it is stated there that to have a single line checkbox, you need this code.

All checkbox of Contact Form 7

span.wpcf7-list-item {
display: block;
}

Specific Checkbox of Contact form 7

.checkbox-610 span.wpcf7-list-item  {
display: block;
}

Hope that helps.

Thank you.

[NiallD1991]

@cramaton Thank you so very much! That is absolutely perfect! You’re a star!

[tristup]

Hi Niall,

Glad to help you out.

Thanks