Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MultiSelect width #716

Open
Shamsa-Ali opened this issue Sep 14, 2023 · 1 comment
Open

MultiSelect width #716

Shamsa-Ali opened this issue Sep 14, 2023 · 1 comment
Labels
bug Something isn't working

Comments

@Shamsa-Ali
Copy link

Shamsa-Ali commented Sep 14, 2023

Describe the bug
hi there, I don't know if it's a bug or I'm doing something wrong. But I need help with the width of the MultiSelect. If I don't select any value the width of the field is small but as I keep selecting values from the dropdown, the width keeps increasing. I just want the width to be fixed. Anyone, any help would be great.. please
the first screenshot is when no values are selected, and the second screenshot is when all values are selected except 1 and the last screenshot is when all value are selected .. you can notice the widths
image
image
image
this is the code

<div
                        style={{width:"80%"}}
                      >
                        <MultiSelect
                        className='w-80'
                        label='Select Product'
                        options={productOptions1}
                        value={product1}
                        onChange={setProduct1}
                        isClearable={true}
                        labelledBy="Select"
                        invalid={true}
                        autosize={false}
                        
                    />  
                      </div>
@Shamsa-Ali Shamsa-Ali added the bug Something isn't working label Sep 14, 2023
@MuhammadRehanRasool
Copy link

Describe the bug hi there, I don't know if it's a bug or I'm doing something wrong. But I need help with the width of the MultiSelect. If I don't select any value the width of the field is small but as I keep selecting values from the dropdown, the width keeps increasing. I just want the width to be fixed. Anyone, any help would be great.. please the first screenshot is when no values are selected, and the second screenshot is when all values are selected except 1 and the last screenshot is when all value are selected .. you can notice the widths image image image this is the code

<div
                        style={{width:"80%"}}
                      >
                        <MultiSelect
                        className='w-80'
                        label='Select Product'
                        options={productOptions1}
                        value={product1}
                        onChange={setProduct1}
                        isClearable={true}
                        labelledBy="Select"
                        invalid={true}
                        autosize={false}
                        
                    />  
                      </div>

Applying "max-width" may help you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants