Multi-select: placeholder moves up after clearing all values

JedWatson / react-select

The Select Component for React.js

https://react-select.com/

MIT License

27.63k stars 4.13k forks source link

Multi-select: placeholder moves up after clearing all values #1319

Closed sunny-g closed 4 years ago

sunny-g commented 8 years ago

Before (on initial render): screen shot 2016-10-22 at 12 47 08 pm

After selecting multiple values (enough to increase the height of the multi-select), then losing focus on the select, and then clearing all of them, the placeholder jumps up a few pixels, as such:

screen shot 2016-10-22 at 12 46 59 pm

frescoraja commented 8 years ago

Please correct if wrong, but this seems like a browser issue to me. I was only able to replicate in Chrome

sunny-g commented 8 years ago

@frescoraja I've only been testing in Chrome, so that could very well be the issue.

akrikos commented 8 years ago

I'm seeing the same thing but to a worse degree. Using rc2 and yes can only reproduce in Chrome.

I don't think that means it's "just" a browser issue though. Remember all of the weird hacks we used to do to get IE to work correctly? Just because it only happens in Chrome does not invalidate the issue as most of us use Chrome (please tell me Chrome isn't the new IE).

gablabelle commented 7 years ago

Using rc3, same problem, in Chrome only also.

rich-poole commented 7 years ago

Using rc5 and still seeing this issue, it's a bit of a showstopper for us as it looks pretty bad in Chrome.

TallOrderDev commented 7 years ago

No solution yet? Just ran into this issue, and it's almost not worth using. :( Still learning how to use react, otherwise I'd love to do a PR to fix. Sorry.

frescoraja commented 7 years ago

i was able to fix this issue using flexbox instead of table display properties.. but if i remember correctly, when autosize=true, things to go #&$!. for my purposes, i didn't need autosize to work so never found a compete solution.

frescoraja commented 7 years ago

I can't reproduce anymore. using chrome 60.0.3112.113 (Official Build) (64-bit)

h23 commented 5 years ago

You can try to set the 'overflow' property of 'Select-control' class to 'inherit'. It works for me. multiselect

geraintdong commented 5 years ago

You can try to set the 'overflow' property of 'Select-control' class to 'inherit'. It works for me.

Thanks for your suggestion. I tried & it works, but cannot understand why. I think it's the only workaround for now

bladey commented 4 years ago

Hello -

In an effort to sustain the react-select project going forward, we're closing old issues.

We understand this might be inconvenient but in the best interest of supporting the broader community we have to direct our efforts towards the current major version.

If you aren't using the latest version of react-select please consider upgrading to see if it resolves any issues you're having.

However, if you feel this issue is still relevant and you'd like us to review it - please leave a comment and we'll do our best to get back to you!