Dropdown Filter Style Issue on Products Page

alexmilne1

Hi,

The sidebar filter dropdown on a products template page, style is all skewed. The CSS has not been edited. Any suggestion on how to best fix this?

I will email you through now the website link and this this thread discussion.

Thanks,

Alex

alexmilne1

Phil

Sorry, but we didn't get any message from you yet.

Please check your mail inbox for our response. Look also inside the spam folder.

If you don't have any message from us, please send your login credentials again.

Be sure that you sent all of the required information.

• link to this forum discussion
• link to your website
• login credentials

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexmilne1

Hi,

I emailed the previous email, that was used for communication, but I got a reply, stating to use the Envato contact page. I have now done so, so hopefully you have the info now, to help with this issue.

Alex

Phil

Please, put the following CSS code in Betheme -> Theme options -> Custom CSS & JS -> CSS, and check if the problem persists.

.column_sidebar_widget .woocommerce-widget-layered-nav .select2-selection{
   height: 100%!important;
}
.column_sidebar_widget .woocommerce-widget-layered-nav .select2-selection__arrow{
   top: 25px!important;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexmilne1

Hi,

It fixes the "unopened filter," but when it drop downs, its still got a large gap.

So half way there...

Phil

Can you tell me on what browser are you looking at it, please?

I have checked that with Firefox and Chrome, and it looks like this for me:

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

alexmilne1

I am viewing this in Chrome Version 100.0.4896.88 (Official Build) (x86_64), on my Mac Book Pro.

My Safari is also having this issue, however instead of creating the gap to the bottom of the dropdown, it done it to the top. Photo attached.

Phil

I have checked that with both Safari and Chrome, and it looks like this:

I do not see any gaps there. So please, clear your browser's cache, and recheck it.

Moreover, the opening of the dropdown depends on how much space it has to open. If it has more space at the top, it will open to the top, and the same otherwise.

Can you explain in more detail what you refer to, please?

Best regards

Learn more: Video Tutorials | How To | FAQ Vote on what comes next