<div className="gds-table--responsive">
  <table className="gds-table">
    <thead>
      <tr className="gds-table__row">
        <th className="gds-table__header">#</th>
        <th className="gds-table__header -text-left">First Name</th>
        <th className="gds-table__header -text-left">Last Name</th>
        <th
          className="gds-table__header gds-table__header--selected -text-left"
        >
          Username (selected)
        </th>
      </tr>
    </thead>
    <tbody>
      <tr className="gds-table__row">
        <th scope="row">1</th>
        <td>Mark</td>
        <td>Otto</td>
        <td>@mdo</td>
      </tr>
      <tr className="gds-table__row">
        <th scope="row">2</th>
        <td>Jacob</td>
        <td>Thornton</td>
        <td>@fat</td>
      </tr>
      <tr className="gds-table__row gds-table__row--selected">
        <th scope="row">3</th>
        <td>Selected Row</td>
        <td>the Bird</td>
        <td>@twitter</td>
      </tr>
      <tr className="gds-table__row gds-table__row--disabled">
        <th scope="row">4</th>
        <td>Disabled Row</td>
        <td>Otto</td>
        <td>@mdo</td>
      </tr>
    </tbody>
  </table>
</div>