Bummer! This is just a preview. You need to be signed in with an account to view the entire instruction.

(UPI) Chapter 6: Navigating with HTML Links and Structuring Data with Tables

Well done!

You have completed (UPI) Chapter 6: Navigating with HTML Links and Structuring Data with Tables!

Sign up for Treehouse Back to Library
Instruction

Making Tables Responsive

Responsive design ensures tables adjust to various screen sizes. CSS media queries allow you to reformat tables for smaller screens.

Responsive Table CSS:

@media only screen and (max-width: 479px) {
  th, td {
    display: block;
  }
  thead {
    display: none;
  }
  tr td:first-child {
    font-weight: bold;
    font-size: 1.1em;
    background-color: lightgreen;
...