<p-table [value]="productsSmall" styleClass="p-datatable-xs" responsiveLayout="scroll">
<ng-template pTemplate="caption">
  Small Table
</ng-template>
<ng-template pTemplate="header">
  <tr>
    <th>Code</th>
    <th>Name</th>
    <th>Category</th>
    <th>Quantity</th>
  </tr>
</ng-template>
<ng-template pTemplate="body" let-product>
  <tr>
    <td>{ { product.code } }</td>
    <td>{ { product.name } }</td>
    <td>{ { product.category } }</td>
    <td>{ { product.quantity } }</td>
  </tr>
</ng-template>
</p-table>

<p-table [value]="productsSmall" styleClass="p-datatable-sm" responsiveLayout="scroll">
  <ng-template pTemplate="caption">
    Small Table
  </ng-template>
  <ng-template pTemplate="header">
    <tr>
      <th>Code</th>
      <th>Name</th>
      <th>Category</th>
      <th>Quantity</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-product>
    <tr>
      <td>{ { product.code } }</td>
      <td>{ { product.name } }</td>
      <td>{ { product.category } }</td>
      <td>{ { product.quantity } }</td>
    </tr>
  </ng-template>
</p-table>

<p-table [value]="productsNormal" responsiveLayout="scroll">
  <ng-template pTemplate="caption">
    Normale Table
  </ng-template>
  <ng-template pTemplate="header">
    <tr>
      <th>Code</th>
      <th>Name</th>
      <th>Category</th>
      <th>Quantity</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-product>
    <tr>
      <td>{ { product.code } }</td>
      <td>{ { product.name } }</td>
      <td>{ { product.category } }</td>
      <td>{ { product.quantity } }</td>
    </tr>
  </ng-template>
</p-table>

<p-table [value]="productsLarge" styleClass="p-datatable-lg" responsiveLayout="scroll">
  <ng-template pTemplate="caption">
    Large Table
  </ng-template>
  <ng-template pTemplate="header">
    <tr>
      <th>Code</th>
      <th>Name</th>
      <th>Category</th>
      <th>Quantity</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-product>
    <tr>
      <td>{ { product.code } }</td>
      <td>{ { product.name } }</td>
      <td>{ { product.category } }</td>
      <td>{ { product.quantity } }</td>
    </tr>
  </ng-template>
</p-table>