Home Forums WC Vendors Pro Support Drop down styling

NOTICE: We've Moved to a Ticket System for Support

As of August 31, 2017 (12am EST) our support forums will be retired (read-only), and we will be moving to a support ticket system.  This will allow us to better organize and answer support requests, and provide a more personalized experience as we assist our customers.

For the time being, we will leave our forums open for reading and learning while we work on creating a more robust Knowledge Base for everyone to use.

If you are a WC Vendors Pro customer please open a support ticket here. 

If you are a WC Vendors user please open a support ticket on the Wordpress.org forums.

The information on this forum is outdated and in most instances no longer relevant. Please be sure to check our documentation for the most up to date information.


Thank you to all of our customers!


Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #57797
    Michael Matker


    I am noticing some of the drop down styling is kind of funky. Here are two examples: https://i.imgur.com/KvtNUDp.png and https://i.imgur.com/z4vsyJ1.png . I checked out the styling with the Storefront theme as well to see if it was just the theme I am using but it seems to have the same issue. Is there a way to add css to fix these drop dowsn?



    Yes, you can. The styling for the Select2 widget just sucks, here’s my SCSS code to override it:

      // Make the select combo boxes with select2 match bootstrap
      .select2-container {
        @extend .form-control; 
        .select2-choice, .select2-dropdown-open .select2-choice {
          border: none !important;
          padding: 0px !important;
        .select2-search {
          padding: 10px;
    // This needs to be in the root, because the .select2-drop element is a direct child of <body>
    .select2-drop.select2-with-searchbox.select2-drop-active, .select2-drop, .select2-drop-multi {
      // border: 1px solid #666;
      border: 1px solid rgba(0, 0, 0, 0.15);
      border-top: none;

    You can modify as you please, and put it into your child theme’s styles.css file.

    Michael Matker

    Here is the code I put into the child theme style.css: https://i.imgur.com/KSho4hc.png

    I am still getting a goofy drop down.


    Try this in the styles.css:

    .select2-container .select2-choice {

    If it does not show the changes, try:

    .select2-container .select2-choice {
    height:36px !important;
    line-height:30px !important;
    Michael Matker

    I tried both and neither worked. Both still show like this https://i.imgur.com/KvtNUDp.png

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘WC Vendors Pro Support’ is closed to new topics and replies.