Responsive tables

responsive-table.css

@media screen and (max-width: 600px) {
  
    table {
      width: 100%;
      border-collapse: collapse;
    }
    
    tr:nth-child(even) {
      background-color: #f0f0f0;
    }

  tr td:first-child {
      font-size: 1.1em;
    }
    tbody td:before {
      content: attr(data-th);
      display: block;
      text-align: center;
    }
  }
  
    td {
      border: 1px solid #d6d6d6;
      padding: 8px;
      text-align: center
    }
  }