Title: rectangle Sharing counter custom css code
Last modified: December 28, 2016

---

# rectangle Sharing counter custom css code

 *  [perflex](https://wordpress.org/support/users/perflex/)
 * (@perflex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/)
 * Greeting heateor team * i was wondering, what is the custom css code to get this
   beautiful rectangle Sharing counter style : [http://i65.tinypic.com/j9ybeq.jpg](http://i65.tinypic.com/j9ybeq.jpg)

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

 *  Plugin Author [Heateor Support](https://wordpress.org/support/users/heateor/)
 * (@heateor)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/#post-8599406)
 * Hi,
 * BTW, that is round share count style 🙂
    You can add following CSS in `Custom
   CSS` option at `Super Socializer > General Options` page in admin area. For horizontal
   sharing interface:
 *     ```
       .the_champ_horizontal_sharing .the_champ_square_count{
           width: 13px !important;
           padding: 2px 3px!important;
       }
       ```
   
 * For vertical/floating sharing interface:
 *     ```
       .the_champ_vertical_sharing .the_champ_square_count{
           width: 13px !important;
           padding: 2px 3px!important;
       }
       ```
   
 * Problem with above CSS is that the width of the counter container is fixed which
   will not be appropriate for 3 digit share counts.
 *  Thread Starter [perflex](https://wordpress.org/support/users/perflex/)
 * (@perflex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/#post-8600045)
 * Greeting again team heateor * im not sure this is the right css code for my request*
   sorry if i didn’t make my question clear but what i want is the count style (
   white borders with blue background and shadow effect) exactly like this one here:
   [http://i66.tinypic.com/kdkhs4.jpg](http://i66.tinypic.com/kdkhs4.jpg)
 *  Plugin Author [Heateor Support](https://wordpress.org/support/users/heateor/)
 * (@heateor)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/#post-8600762)
 * Try this:
    [http://support.heateor.com/how-to-customize-the-look-of-individual-share-counts/](http://support.heateor.com/how-to-customize-the-look-of-individual-share-counts/)
 *  Thread Starter [perflex](https://wordpress.org/support/users/perflex/)
 * (@perflex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/#post-8600835)
 * Cool !!!! that’s exactly what i was asking about * thank you guys you’re the 
   best *
 *  Plugin Author [Heateor Support](https://wordpress.org/support/users/heateor/)
 * (@heateor)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/#post-8600843)
 * Cool. Thanks 🙂

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

The topic ‘rectangle Sharing counter custom css code’ is closed to new replies.

 * ![](https://ps.w.org/super-socializer/assets/icon-128x128.png?rev=1866723)
 * [Social Share, Social Login and Social Comments Plugin - Super Socializer](https://wordpress.org/plugins/super-socializer/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/super-socializer/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/super-socializer/)
 * [Active Topics](https://wordpress.org/support/plugin/super-socializer/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/super-socializer/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/super-socializer/reviews/)

 * 5 replies
 * 2 participants
 * Last reply from: [Heateor Support](https://wordpress.org/support/users/heateor/)
 * Last activity: [9 years, 5 months ago](https://wordpress.org/support/topic/rectangle-sharing-counter-custom-css-code/#post-8600843)
 * Status: not resolved