Creating Responsive Tables
When building a responsive website where the main responsibility is to display data in tables, one needs to put some thought into how to present this data on smaller screens. Tables are, of course, as wide as the number of data columns, so this presents some challenges with how to display it when the view width is limited. Using Bootstrap's table-responsive Bootstrap's table-responsive class offers one solution, where the table is given a horizontal scrollbar. This is not ideal as it requires the user to scroll the table to see all the data in a row. This can be done by touching the table but this is not obvious and some users may think they need to use the scrollbar. This then reduces usability when there are more than a few rows in the table - the user would scroll to the bottom of the table before scrolling horizontally, leading to some frustrating vertical scrolling if the data they are looking at is back up at the top of the table. Rotating the Data The