Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Responsive table CSS style missing
See original GitHub issuev4
Issue Type
- Bug (https://github.com/bootstrap-styled/v4/blob/master/.github/CONTRIBUTING.md#bug-reports)
- Feature (https://github.com/bootstrap-styled/v4/blob/master/.github/CONTRIBUTING.md#feature-requests)
Description
When I use <Table responsive={true}>...</Table> it wraps the table with a div with a class table-responsive (that’s OK) but it does not apply the styles because the styles for this class are missing. There should be a style for this class, something like:
.table-responsive { overflow: auto; }
Steps to reproduce
Just use <Table responsive={true}>...</Table> and see the source code.
Versions
- Node/NPM: 6.1.2
- OS: MacOS
- v4: 3.2.0
Issue Analytics
- State:
- Created 4 years ago
- Comments:5 (4 by maintainers)
Top Results From Across the Web
Right padding is missing from a responsive HTML table
Right padding is missing from a responsive HTML table ; you may use margin-right on the table to overide this default behavior. –...
Read more >How to Create Responsive Tables using CSS without 'table' Tag
Step 1: Create Master Div for the Table · Step 2: Add a Table Caption · Step 3: Create a Table Header Row...
Read more >Responsive Data Tables | CSS-Tricks
Responsive design is all about adjusting designs to accommodate screens of different sizes. So what happens when a screen is narrower than the ......
Read more >How to create a responsive table in CSS - Educative.io
In this shot, we'll discuss using CSS to make a table responsive. ... By applying CSS overflow-x:auto style, table become device responsive for...
Read more >Table Layouts - W3C
Document languages other than HTML may not contain all the elements in the CSS 2.1 table model. In these cases, the "missing" elements...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I don’t think we should remove the wrapper. According to Bootstrap 4, a responsive table should be wrapped by a div. The question is, why is the css not working - i.e. why is
.table-responsivebeing ignored?I think this is fixes using new utilities