Global filter width when selecting element

By default, UX dynamically resizes the filter dropdown selection box based on the initial element selected. For example, if I have an element with a shorter name selected, the dropdown is not as wide as when I have an element with a longer name (see below):

image

image

In situations where the element name is long (e.g., code + description), it would be advantageous to have a wider dropdown box (regardless of which item was initially selected). Otherwise, it requires quite a bit of horizontal back-and-forth scrolling to see the names.

I was attempting to override the minimum-width using CSS and had limited success. Using the CSS below, I could make the filters wider globally (by inserting to custom-style.css) but couldn’t find a way to only apply the min-width to a specific filter on a specific page.

The closest I could get is creating a dummy widget to store the CSS (so it only applies to that page) but even then, it would apply to all filters on the toolbar. Has anyone discovered a way to either (a) apply min-width to a specific subnm filter or (b) make the entire dropdown box expandable (by dragging the corner)? Thanks!

.dropdown-menu.tm1-subnm-hierarchy-style {
    min-width: 500px !important;
}

image

2 Likes