Dropdowns in table are cut off by overflow: hidden
Robdel12 opened this issue · comments
In almost all of our tables we have .btn-group dropdowns and none of will work inside of .table-responsive because we have overflow: hidden on it. Which is expected because this is how the responsive table solution works. It makes the table scrollable left to right when it's wider than the current viewport.
I'm currently trying figure out a way to d,o this probably with JavaScript, but I wanted to see what others think. Let the community power do work! 👍 😄
Sorry @Robdel12, I'm not familiar with the framework you're using here (just saw your tweet and jumped in), but I can tell you that there is no way to unhide things being clipped with overflow: hidden; in CSS without scrolling or removing overflow: hidden;. The best you could do in JavaScript would be to recreate the element outside the container with overflow: hidden; set, although that seems like a cumbersome solution at best.
However, if you share your code (link to your github repo, or even better would be a rendered version like codepen or jsfiddle) I could take a closer look and offer a better suggestion.
Can you create a fiddle? It would make it easier to debug
Is it the same problem mentioned in http://stackoverflow.com/questions/23172507/bootstrap-3-btn-group-in-a-table-responsive?
Closing this issue since it is an issue with Bootstrap (see: twbs/bootstrap#11037)