Title: Custom CSS checkboxes
Last modified: February 28, 2017

---

# Custom CSS checkboxes

 *  [Mart89](https://wordpress.org/support/users/mart89/)
 * (@mart89)
 * [9 years, 1 month ago](https://wordpress.org/support/topic/custom-css-checkboxes/)
 * Hi, I have custom checkboxes throughout my checkout page where the check box 
   itself is hidden and a ‘:before’ selector attached to the label replaces it.
 * Unfortunately this method only works when the checkbox is **next** to the label,
   rather than inside it. Any suggestions on how I can get around this, or might
   the plugin be updated?
 *     ```
       .woocommerce-checkout #payment input[type="checkbox"] {
       	    display:none;
       }
       .woocommerce-checkout #payment input[type="checkbox"] ~ label:before {
         border: 0;
         content: "\00a0";
         display: block;
         float: left;
         font: 16px/1em sans-serif;
         height: 16px;
         margin: -2px 7px 0 0;
         padding:0;
         vertical-align: top;
         width: 16px;
         background:rgb(228,230,231);
       }
   
       .woocommerce-checkout #payment input[type="checkbox"]:checked ~ label:before {
         background: url('xxx') -76px 4px / 87px auto no-repeat rgb(228,230,231);
         color: #666 ;
         content: " ";
         text-align: center;
       }
       ```
   

The topic ‘Custom CSS checkboxes’ is closed to new replies.

 * ![](https://ps.w.org/woocommerce-mailchimp/assets/icon.svg?rev=1495270)
 * [WP WooCommerce Mailchimp](https://wordpress.org/plugins/woocommerce-mailchimp/)
 * [Support Threads](https://wordpress.org/support/plugin/woocommerce-mailchimp/)
 * [Active Topics](https://wordpress.org/support/plugin/woocommerce-mailchimp/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/woocommerce-mailchimp/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/woocommerce-mailchimp/reviews/)

## Tags

 * [checkboxes](https://wordpress.org/support/topic-tag/checkboxes/)
 * [css](https://wordpress.org/support/topic-tag/css/)
 * [custom](https://wordpress.org/support/topic-tag/custom/)

 * 0 replies
 * 1 participant
 * Last reply from: [Mart89](https://wordpress.org/support/users/mart89/)
 * Last activity: [9 years, 1 month ago](https://wordpress.org/support/topic/custom-css-checkboxes/)
 * Status: not resolved