chromium/components/policy/resources/webui/test/policy_test_table.html

<style>
  /* Shared styles for both table and card views */
  .table {
    width: 100%;
    box-sizing: border-box;
  }

  button {
    background: var(--table-header);
    color: var(--text-color);
    font-size: 125%;
    font-weight: bold;
    padding: 5px;
    border: 1px solid var(--table-border);
    border-radius: 0 0 var(--element-border-radius)
                    var(--element-border-radius);
    box-sizing: border-box;
    width: 100%;
  }

  button:hover {
    filter: brightness(var(--action-row-button-hover-brightness));
  }

  button:active {
    filter: brightness(var(--action-row-button-active-brightness));
  }

  /* Table view for wide screen */
  @media only screen and (min-width: 711px) {
    .table {
      display: table;
      border: 1px solid var(--table-border);
      border-radius: var(--element-border-radius)
                    var(--element-border-radius) 0 0;
      border-bottom: none;
    }

    header {
      display: table-row;
      background-color: var(--table-header);
      font-size: 100%;
    }

    .cell {
      border-right: 1px solid var(--table-border);
      display: table-cell;
      padding: 12px 7px;
    }

    #namespace-header {
      border-radius: var(--element-border-radius) 0 0 0;
    }

<if expr="is_android or is_ios">
    #namespace-header {
     display: none;
   }
</if>

    #header-remove-btn-cell {
      border-radius: 0 var(--element-border-radius) 0 0;
      border-right: none;
    }
  }

  /* Card view for narrow screen / mobile */
  @media only screen and (max-width: 710px) {
    header {
      display: none;
    }

    .cell {
      display: block;
      border: none;
      padding: none;
    }
  }

</style>
<div class="table" role="table">
  <header role="row">
    <div class="cell" id="namespace-header">$i18n{testTableNamespace}</div>
    <div class="cell">$i18n{testTableName}</div>
    <div class="cell">$i18n{testTableValue}</div>
    <div class="cell">$i18n{testTablePreset}</div>
    <div class="cell">$i18n{testTableSource}</div>
    <div class="cell">$i18n{testTableScope}</div>
    <div class="cell">$i18n{testTableLevel}</div>
    <div class="cell" id="header-remove-btn-cell"></div>
  </header>
</div>
<button id="add-policy-btn">+</button>