[material-ui][Autocomplete] Resizing on hover/focus when displayed in a table with table-layout: auto set about material-ui HOT 7 CLOSED

It's a regression from #41781. Created PR to fix it: #42452

from material-ui.

Until there is a fix you can workaround with this:

sx={{ "& :hover .MuiAutocomplete-input": { minWidth: "30px" } }}

from material-ui.

sx={{ "& :hover .MuiAutocomplete-input": { minWidth: "30px" } }}

True, that works for hovering over the input box in this specific scenario, however if you hover over the dropdown element or if you select an item then the Autocomplete will start resizing again.

from material-ui.

Yeah that's annoying I think workaround is going to be awkward because of specificity. I'm also looking for a fix or workaround to this issue. This bug means you can't use autocomplete in flexbox without setting a width.

from material-ui.

Yeah that's annoying I think workaround is going to be awkward because of specificity. I'm also looking for a fix or workaround to this issue. This bug means you can't use autocomplete in flexbox without setting a width.

Actually looking at the code my workaround is just missing the focused selector.

sx={{ "& :hover .MuiAutocomplete-input, & .Mui-focused .MuiAutocomplete-input": { minWidth: "30px" } }}

from material-ui.

I'm still having the same issue

Thanks for the workaround

from material-ui.

@mimccio Which version are you on?

from material-ui.