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 pane: data-allow-overlap=false not respected #10469

Open
bwydev opened this issue Jul 27, 2017 · 3 comments
Open

Dropdown pane: data-allow-overlap=false not respected #10469

bwydev opened this issue Jul 27, 2017 · 3 comments

Comments

@bwydev
Copy link

bwydev commented Jul 27, 2017

If a dropdown pane is larger than the browser window, the pane is not resized to respect window width. (data-allow-overlap=false is default according to docs)

FD 6.4.1

Testing: Resize browser window on CodePen to smaller than the large dropdown pane and refresh:
https://codepen.io/bwy/pen/GvJyqJ

@colinmackinlay
Copy link
Contributor

colinmackinlay commented Jul 27, 2017

Seems this could be related to explicitly setting the width. Is the explicit width important for you?

Setting data-position="right" data-alignment="bottom" on your medium drop down which should cause overlap is behaving correctly and repositioning it.

In iOS Safari the main div gets resized to allow the large dropdown to fit. so the window becomes scrollable.

In Chrome it behaves as expected and the large dropdown repositions to bottom center and then overlaps the left hand side of the window without resizing the main div so the start of the lines aren't readable.

Both are sort of consistent with the docs but not each other and not ideal but they behave much more nicely without the explicit width

@bwydev
Copy link
Author

bwydev commented Jul 27, 2017

The widths are explicitly set in settings under "17. Dropdown", i.e.:

$dropdown-sizes: (
  tiny: 100px,
  small: 200px,
  large: 900px,
);

And medium is default at 300px, so works as long as the browser window is wider than 300px. So same issue, just using large at 1000px to demonstrate.

@kball
Copy link
Contributor

kball commented Aug 1, 2017

This is a real bug, probably introduced in the explicit positioning rework. I'll take it.

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

6 participants