简体   繁体   中英

How to make ng-select width to fit placeholder and items?

I have the <nb-select> with the following placeholder :

<nb-select id="weather" placeholder="Expected Weather" fullWidth>
  <nb-option [value]="1">Dry</nb-option>
  <nb-option [value]="2">Wet</nb-option>
</nb-select>

I'm trying to set width to be able auto fit it content to show not only items but the placeholder too.

Tried to use 'fullWidth', but it works only for the options content:

在此处输入图像描述


Checked a few solutions from the following posts:

How to always display a placeholder of ng-select?

Make ng-select width adjust to selected items / available options?

Unfortunately it didn't work.

Thanks

The solution I found is to set min-width to 100% instead of using the fullWidth :

<nb-select placeholder="Expected Weather" [ngStyle]="{'min-width': '100%'}" id="weather">
  <nb-option [value]="1">Dry</nb-option>
  <nb-option [value]="2">Wet</nb-option>
</nb-select>

在此处输入图像描述

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM