[Resolved] How to change size of List Sorting

[Author]

Posts

[toolset-dave]

Hi, I use sorting in my Custom Search with style "list". How can I change the width of it? It is too wide for my purposes.

[Minesh]

Hello. Thank you for contacting the Toolset support.

Well - you can adjust the field width by adding custom jQuery code to your view's filter section's JS box or by adding custom CSS to your view's filter section's CSS box.

For example:

jQuery(document).ready(function($){

$('.sorting-controls  span.js-wpv-sort-list-orderby-dropdown, span.js-wpv-sort-list-item, span.js-wpv-sort-list-item ').attr('style', 'width: 12.3em !important');


});

More info:
=> https://stackoverflow.com/questions/2655925/how-to-apply-important-using-css

[toolset-dave]

Hi Minesh, thank you, it works. But it caused the problem with width of wpv-sort-order. I tried to modified the code, but wasn´t able to make it functional. Just find out that the width of wpv-sort-order shoud be 9em.

[Minesh]

Well - you need to find the right selector and method to avoid the conflict. You should make sure that you need to build your custom JS/CSS that do not cause any issue with other selectors.

However, you must have knowledge of CSS or JS to do such customization.