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

[Dropdown] Items Should Display As Block For >= 2.2.11 #6359

Closed
pzanitti opened this issue Apr 27, 2018 · 2 comments
Closed

[Dropdown] Items Should Display As Block For >= 2.2.11 #6359

pzanitti opened this issue Apr 27, 2018 · 2 comments

Comments

@pzanitti
Copy link

pzanitti commented Apr 27, 2018

2.2.11 contained a big update for dropdowns. https://github.com/Semantic-Org/Semantic-UI/releases/tag/2.2.11

I am suspecting this change is the culprit:

Dropdown - Dropdowns will automatically detect when they are offscreen to the right and will open leftward instead Thanks @Graveheart #4211

This behavior was working fine and I see no changes in the documentation so I figure this is a regression.

Steps

  1. Make a dropdown on the right of the screen, e.g. in a right menu
  2. Have it contain long elements

Expected Result

The menu flushes to the left as to have enough space for the items.

Actual Result

The menu goes inline because it gets set style="display: flex !important;" instead of style="display: block !important;".

Version

>= 2.2.11

Testcase

Working perfectly fine in 2.2.10: https://jsfiddle.net/ca0rovs3/480/
Broken in 2.2.11: https://jsfiddle.net/ca0rovs3/481/
Broken in latest (2.3.1): https://jsfiddle.net/ca0rovs3/482/

@pzanitti
Copy link
Author

I will force direction to downward for now, it appears to do the trick.

https://jsfiddle.net/ca0rovs3/483/

@jlukic
Copy link
Member

jlukic commented Sep 17, 2018

I've fixed this in next with a css solve that makes sure display: flex isnt applied to dropdown elements.

56366b9

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants