search

scioly / scioly.org

Scioly.org server files for public contributions
6 stars 0 forks source link

Make `/var/www/html/src/css/tests.css` mobile friendly #14

Closed georgemsun closed 4 years ago

georgemsun commented 4 years ago

Add max-width and overflow: scroll specifications to /var/www/html/src/css/tests.css so that pages like the Test Exchange which have wide tables do not run off the page on small screens.

Screen Shot 2020-09-04 at 11 46 59 1
georgemsun commented 4 years ago

Added table-layout: fixed; which prevents overflow off the page. I think this is preferable to an overflow-x scroll; which obscures columns of the table and is not intuitively scrollable.

georgemsun commented 4 years ago

Removed table-layout: fixed; as it was making column widths all the same. And added a parent element div.table with overflow-x: scroll; for screen widths narrower than 800px. Tables can now be horizontally scrolled on small screens.

georgemsun commented 4 years ago

Changed overflow-x: scroll; to overflow-x: auto; by recommendation of Nydauron.