Responsive stacked table

A responsive stacked table collapses at narrow widths for better readability on small screens.

Stacked bordered table (when on a mobile-width screen)
Document title Description Year
Declaration of Independence Statement adopted by the Continental Congress declaring independence from the British Empire. 1776
Bill of Rights The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms. 1791
Declaration of Sentiments A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens. 1848
Emancipation Proclamation An executive order granting freedom to slaves in designated southern states. 1863
Stacked bordered table with headers (when on a mobile-width screen)
Document title Description Year
Declaration of Independence Statement adopted by the Continental Congress declaring independence from the British Empire. 1776
Bill of Rights The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms. 1791
Declaration of Sentiments A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens. 1848
Emancipation Proclamation An executive order granting freedom to slaves in designated southern states. 1863
Stacked borderless table (when on a mobile-width screen)
Document title Description Year
Declaration of Independence Statement adopted by the Continental Congress declaring independence from the British Empire. 1776
Bill of Rights The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms. 1791
Declaration of Sentiments A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens. 1848
Emancipation Proclamation An executive order granting freedom to slaves in designated southern states. 1863
Stacked borderless table with headers (when on a mobile-width screen)
Document title Description Year
Declaration of Independence Statement adopted by the Continental Congress declaring independence from the British Empire. 1776
Bill of Rights The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms. 1791
Declaration of Sentiments A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens. 1848
Emancipation Proclamation An executive order granting freedom to slaves in designated southern states. 1863 
<div class="width-mobile">

  <table class="usa-table usa-table--stacked">
    <caption>Stacked bordered table (when on a mobile-width screen)</caption>
    <thead>
      <tr>
        <th scope="col">Document title</th>
        <th scope="col">Description</th>
        <th scope="col">Year</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Independence</th>
        <td data-label="Description">Statement adopted by the Continental Congress declaring independence from the British Empire.</td>
        <td data-label="Year">1776</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Bill of Rights</th>
        <td data-label="Description">The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms.</td>
        <td data-label="Year">1791</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Sentiments</th>
        <td data-label="Description">A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens.</td>
        <td data-label="Year">1848</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Emancipation Proclamation</th>
        <td data-label="Description">An executive order granting freedom to slaves in designated southern states.</td>
        <td data-label="Year">1863</td>
      </tr>
    </tbody>
  </table>

  <table class="usa-table usa-table--stacked-header">
    <caption>Stacked bordered table with headers (when on a mobile-width screen)</caption>
    <thead>
      <tr>
        <th scope="col">Document title</th>
        <th scope="col">Description</th>
        <th scope="col">Year</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Independence</th>
        <td data-label="Description">Statement adopted by the Continental Congress declaring independence from the British Empire.</td>
        <td data-label="Year">1776</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Bill of Rights</th>
        <td data-label="Description">The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms.</td>
        <td data-label="Year">1791</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Sentiments</th>
        <td data-label="Description">A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens.</td>
        <td data-label="Year">1848</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Emancipation Proclamation</th>
        <td data-label="Description">An executive order granting freedom to slaves in designated southern states.</td>
        <td data-label="Year">1863</td>
      </tr>
    </tbody>
  </table>





  <table class="usa-table usa-table--borderless usa-table--stacked">
    <caption>Stacked borderless table (when on a <span class="text-no-wrap">mobile-width</span> screen)</caption>
    <thead>
      <tr>
        <th scope="col">Document title</th>
        <th scope="col">Description</th>
        <th scope="col">Year</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Independence</th>
        <td data-label="Description">Statement adopted by the Continental Congress declaring independence from the British Empire.</td>
        <td data-label="Year">1776</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Bill of Rights</th>
        <td data-label="Description">The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms.</td>
        <td data-label="Year">1791</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Sentiments</th>
        <td data-label="Description">A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens.</td>
        <td data-label="Year">1848</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Emancipation Proclamation</th>
        <td data-label="Description">An executive order granting freedom to slaves in designated southern states.</td>
        <td data-label="Year">1863</td>
      </tr>
    </tbody>
  </table>

  <table class="usa-table usa-table--borderless usa-table--stacked-header">
    <caption>Stacked borderless table with headers (when on a mobile-width screen)</caption>
    <thead>
      <tr>
        <th scope="col">Document title</th>
        <th scope="col">Description</th>
        <th scope="col">Year</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Independence</th>
        <td data-label="Description">Statement adopted by the Continental Congress declaring independence from the British Empire.</td>
        <td data-label="Year">1776</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Bill of Rights</th>
        <td data-label="Description">The first ten amendments of the U.S. Constitution guaranteeing rights and freedoms.</td>
        <td data-label="Year">1791</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Declaration of Sentiments</th>
        <td data-label="Description">A document written during the Seneca Falls Convention outlining the rights that American women should be entitled to as citizens.</td>
        <td data-label="Year">1848</td>
      </tr>
      <tr>
        <th data-label="Document title" scope="row">Emancipation Proclamation</th>
        <td data-label="Description">An executive order granting freedom to slaves in designated southern states.</td>
        <td data-label="Year">1863</td>
      </tr>
    </tbody>
  </table>
</div>