.table-responsive doesn't fill up width in Firefox
Closed this issue · 10 comments
When adding the v4 ".table-responsive" class to a table, the thead and tbody elements will use only the absolute necessary space in Firefox despite of the width of 100% of the table itself. This is due to the "display: block" necessary for the overflow.
Please post a JS Bin or JS Fiddle that demonstrates the problem.
A screenshot would also be appreciated.
Trying again (I can't seem to do anything right today!). I made a JS Fiddle of this issue here: https://jsfiddle.net/stephaniepurvis/pj6w2n64/6/
I don't see a problem with the table though. I am viewing this in Firefox 43.0.1 for Mac.
Sorry, my fault!
I've added ".table-responsive" to the table itself instead of wrapping a <div class="table-responsive"></div> around
Per Migrating to v4:
Responsive tables no longer require a wrapping element. Instead, just put the .table-responsive right on the <table>.
Will this be the case and just has not been implemented yet?
Hello. Sorry to bother you. I've faced with the same issue, don't know how to solve it correctly because I need to change about thousand pages. Can't do this huge work twice or more.
The issue is not only with Firefox. So, if to wrap a table with div = table-responsive, then everything is fine (see the first table), but if just use a table with class = table-responsive, then the table don't expand 100% (see table 2).
html file for testing
I'd like to know if this is gonna be fixed or should I wrap tables in div tags? I'm worried that div tags will stop working one day because it's kind of old feature... or will it be working forever? :)
@mdo PING.
Hi there! Yes, I've been in and out and outlandishly unresponsive to almost everything. Apologies for that—getting caught up slowly but surely.
@mdo Are the docs wrong, or is the new
.table-responsivebroken?
It's now a modifier, not a wrapper. PR has been opened to address that.
Lastly, there's no bug here near as I can tell. FF50 and latest Safari look great.