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 in responsive table in panel -> Android browser problem with y-overflow #13214

Closed
beeb opened this issue Mar 28, 2014 · 15 comments
Closed
Labels

Comments

@beeb
Copy link

beeb commented Mar 28, 2014

If i put a dropdown inside a table cell, and i put the table in a div.table-responsive, and I put everything inside a panel, the dropdown of the last row is invisible due to y-overflow: hidden; at low resolutions

If I manually set the y-overflow to scroll, the problem is resolved in Chrome (desktop), but my Android browser, even though showing a vertical scroll bar upon opening the dropdown, doesn't want to scroll down to show the options.

@cvrebert
Copy link
Collaborator

  • What version of Android?
  • To confirm, you mean the non-Chrome Android stock browser, correct?
  • Please post your example as a JS Fiddle or JS Bin.

@cvrebert cvrebert added the css label Mar 28, 2014
@beeb
Copy link
Author

beeb commented Mar 28, 2014

It happens with both chrome on android and native android browser. Android version is 4.4.2 AOSP. Here is a MWE : http://jsbin.com/bogejenu/3/edit?html,output

@cvrebert
Copy link
Collaborator

All your rows are in <thead> and there isn't a <tbody>. That's rather weird.

@beeb
Copy link
Author

beeb commented Mar 28, 2014

Mistake on my side, I edited sorry
http://jsbin.com/bogejenu/3/edit?html,output

@juthilo juthilo added this to the v3.2.0 milestone Mar 29, 2014
@cvrebert
Copy link
Collaborator

@beeb Could you please re-test against the bleeding-edge Bootstrap CSS in the master branch?

@cvrebert
Copy link
Collaborator

cvrebert commented May 4, 2014

Closing until we get a response from @beeb. Happy to reopen once we do.

@cvrebert cvrebert closed this as completed May 4, 2014
@mdo mdo removed this from the v3.2.0 milestone May 8, 2014
@beeb
Copy link
Author

beeb commented Jun 10, 2014

Hey guys sorry for the delay ! Still no luck with v 3.1.1 on my side (stock browser and chrome on Android 4.4.2 AOSP)

@cvrebert
Copy link
Collaborator

@beeb v3.1.1 != latest master

@beeb
Copy link
Author

beeb commented Jun 10, 2014

Okay I couldn't figure out how to use the latest master on jsbin, will try later.

@hnrch02
Copy link
Collaborator

hnrch02 commented Jun 10, 2014

@beeb This JS Bin uses the bleeding-edge CSS from master.

@beeb
Copy link
Author

beeb commented Jun 10, 2014

Thanks @hnrch02, I tested this JS Bin on my smartphone and the problem is still present.

Cheers

@cvrebert cvrebert reopened this Jun 10, 2014
@cvrebert cvrebert added this to the v3.2.1 milestone Jun 10, 2014
@cvrebert
Copy link
Collaborator

@beeb Thanks for re-testing.

@mdo
Copy link
Member

mdo commented Jun 19, 2014

This isn't limited to Android. We'd need to rewrite the dropdown plugin to remove it from the DOM and place it over the content, something we've completely avoided for reasons of complicating the JS more.

As far as I know, there's no way around this—the parent is cropping the absolutely positioned dropdown. Same would happen to any other absolutely position element.

@mdo mdo closed this as completed Jun 19, 2014
@mdo mdo removed this from the v3.2.1 milestone Jun 19, 2014
@mdo
Copy link
Member

mdo commented Jun 19, 2014

Made a note for v4 btw.

@gonzarzeno
Copy link

No solution yet?

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

No branches or pull requests

6 participants