Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

vue-multiselect dropdown list without horizontal scrollbar

I'm using vue-multiselect in single-select mode and trying to apply styles to make options dropdown list be same width as most wide option. I achieved this, but can't get .multiselect__option be same width as parent .multiselect__element:

https://jsfiddle.net/xo9f7jby/30/

.multiselect {
    width: fit-content
}

.multiselect__content-wrapper, .multiselect__element {
    width: fit-content; 
}

.multiselect__option {
    width: 100%;
}
like image 945
Max77 Avatar asked Mar 26 '18 20:03

Max77


1 Answers

One simple solution would be to remove fit-content from .multiselect__element:

.multiselect__content-wrapper /*, .multiselect__element */ {
  width: fit-content; 
}

Updated fiddle: https://jsfiddle.net/xo9f7jby/33/

like image 130
acdcjunior Avatar answered Oct 21 '22 23:10

acdcjunior