title: Primeng 9 Table, horizontal scroll issue
body: <p>I am trying to implement full page scroll in primeng table similar to one given at <a href="https://www.primefaces.org/primeng/v9-lts/#/table/scroll" rel="nofollow noreferrer">https://www.primefaces.org/primeng/v9-lts/#/table/scroll</a>. But I am not getting the horizontal scroll bar. Even the headers and columns are misaligned as shown below :
  <a href="https://i.stack.imgur.com/TWCyd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TWCyd.png" alt="enter image description here" /></a></p>
  <p>Please advise.
  My code given below :-</p>
  <pre><code>&lt;p-table [columns]=&quot;cols&quot; [value]=&quot;cars2&quot; [scrollable]=&quot;true&quot; [style]=&quot;{width:'300px'}&quot;&gt;
  
    &lt;ng-template pTemplate=&quot;colgroup&quot; let-columns&gt;
      &lt;colgroup&gt;
        &lt;col *ngFor=&quot;let col of columns&quot; style=&quot;width:150px&quot;&gt;
      &lt;/colgroup&gt;
    &lt;/ng-template&gt;
    &lt;ng-template pTemplate=&quot;header&quot; let-columns&gt;
      &lt;tr&gt;
        &lt;th *ngFor=&quot;let col of columns&quot;&gt;
          {{col.header}}
        &lt;/th&gt;
      &lt;/tr&gt;
    &lt;/ng-template&gt;
    &lt;ng-template pTemplate=&quot;body&quot; let-rowData let-columns=&quot;columns&quot;&gt;
      &lt;tr&gt;
        &lt;td *ngFor=&quot;let col of columns&quot;&gt;
          {{rowData[col.field]}}
        &lt;/td&gt;
      &lt;/tr&gt;
    &lt;/ng-template&gt;
  &lt;/p-table&gt;
  
  </code></pre>
  <p>The prime ng related packages that are included in my project:</p>
  <pre><code>&quot;primeflex&quot;: &quot;1.1.0&quot;,
  &quot;primeicons&quot;: &quot;^2.0.0&quot;,
  &quot;primeng&quot;: &quot;^9.1.3&quot;,
  </code></pre>