Controlling dropdown widths #1226
Replies: 5 comments 15 replies
-
Select and Autocomplete dropdown width cannot be changed, if you need this feature, use Popover component instead. |
Beta Was this translation helpful? Give feedback.
-
I was able to achieve this on the
The |
Beta Was this translation helpful? Give feedback.
-
You can change the width through Styles API by overriding width of wrapper element of Autocomplete. You just need to add one line of code: You can find all inner elements of a component in styles tab of mantine documentation:(https://mantine.dev/core/autocomplete/?t=styles-api) |
Beta Was this translation helpful? Give feedback.
-
it would be beneficial to have the dropdown width adjusted depending on the width of the options. |
Beta Was this translation helpful? Give feedback.
-
The feature is available with |
Beta Was this translation helpful? Give feedback.
-
Hello! Nice components you got here. Thanks for making them free.
I was wondering how I can make dropdowns from
<Select />
and<Autocomplete />
not constrain their widths to the width of the inputs they control.For example, I have this dropdown:
It shows a horizontal scroll bar when you hover over it. It would be nice if there were a
scrollAreaProps
orpaperProps
prop (or whatever is relevant) on the<Select />
/<Autocomplete />
components and something there that would allow it to grow in size, like{ style: { right: "auto" } }
. But I don't know how it actually works. I mean only to convey my intention.Any guidance would be appreciated. Thank you :)
Beta Was this translation helpful? Give feedback.
All reactions