Title: Checkbox styling
Last modified: August 22, 2016

---

# Checkbox styling

 *  [DonCHU](https://wordpress.org/support/users/donchu/)
 * (@donchu)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/checkbox-styling/)
 * I’ve created a check box and want to have the items listed in separate lines.
   I found a page on the support area that says to add “1
    span.wpcf7-list-item {
   display: block; }” to my theme’s stylesheet. I’m not a coder, so I’m struggling
   with this guidance. Where am I supposed to add/change the code? Nothing I’ve 
   tried works.
 * checkbox {
    display: block; min-height: 25px; margin-top: 10px; margin-bottom:
   10px; padding-left: 20px; vertical-align: middle; } .radio label, .checkbox label{
   display: inline; margin-bottom: 0; font-weight: normal; cursor: pointer; } .radio
   input[type=”radio”], .radio-inline input[type=”radio”], .checkbox input[type=”
   checkbox”], .checkbox-inline input[type=”checbox”] { float: left; margin-left:-
   20px; } .radio + .radio, .checkbox + .checkbox span.wpcf7-list-item { display:
   block margin-top: -5px; } .radio-inline, .checkbox-inline { display: inline-block;
   padding-left: 20px; margin-bottom: 0; vertical-align: middle; font-weight: normal;
   cursor: pointer;
 * [https://wordpress.org/plugins/contact-form-7/](https://wordpress.org/plugins/contact-form-7/)

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

 *  [Neil Murray](https://wordpress.org/support/users/buzztone/)
 * (@buzztone)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/checkbox-styling/#post-5755923)
 * See [Styling Contact Form](http://contactform7.com/styling-contact-form/) for
   a general explanation of styling CF7 forms using CSS.
 * There is a link at the bottom of the page to a comprehensive and detailed article
   on **Styling Contact Form 7 Forms**. The article shows people, with suitable 
   HTML & CSS skills, how to change the appearance of their Contact Form 7 Forms
   to meet their particular requirements.
 *  Thread Starter [DonCHU](https://wordpress.org/support/users/donchu/)
 * (@donchu)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/checkbox-styling/#post-5756114)
 * Buzztone, thank you for replying, but as you can see from my original post, I
   already visited that page and got the code snippet(“span.wpcf7-list-item { display:
   block; }”). I’m not sure which file in my “theme” needs the snippet. Any chance
   you can point me to the right part of the code I need to update?
 *  [Neil Murray](https://wordpress.org/support/users/buzztone/)
 * (@buzztone)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/checkbox-styling/#post-5756115)
 * If you include a link to your Contact Form 7 form here, others looking for a 
   bit CSS styling practice may be able and willing to offer you a solution.
 * The article I linked to is aimed only at people with ​​suitable HTML & CSS skills
   and does not encourage copying and pasting code snippets without understanding
   what you are doing and why.
 *  Thread Starter [DonCHU](https://wordpress.org/support/users/donchu/)
 * (@donchu)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/checkbox-styling/#post-5756120)
 * Thanks, I’m an entry-level coder at best and can work my way around a little 
   bit of this stuff, but will take any guidance/feedback I can get.
 * The form is located here:
 * [http://chu.edu/chu-fact-sheet/educational-outreach-form/](http://chu.edu/chu-fact-sheet/educational-outreach-form/)
 * The php template that I’m using is listed above in my original post. I don’t 
   know where to add the suggested code snippet of “span.wpcf7-list-item { display:
   block; }”
 * Any help is greatly appreciated!

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

The topic ‘Checkbox styling’ is closed to new replies.

 * ![](https://ps.w.org/contact-form-7/assets/icon.svg?rev=2339255)
 * [Contact Form 7](https://wordpress.org/plugins/contact-form-7/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/contact-form-7/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/contact-form-7/)
 * [Active Topics](https://wordpress.org/support/plugin/contact-form-7/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/contact-form-7/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/contact-form-7/reviews/)

## Tags

 * [check box](https://wordpress.org/support/topic-tag/check-box/)

 * 4 replies
 * 2 participants
 * Last reply from: [DonCHU](https://wordpress.org/support/users/donchu/)
 * Last activity: [11 years, 4 months ago](https://wordpress.org/support/topic/checkbox-styling/#post-5756120)
 * Status: not resolved