CODEWITHSUNDEEP
htmlcssangularprimengprimeng-turbotable
Hadas
Hadas

Reputation: 41

Primeng turbo table cell data overlapping other cells

How do I prevent primeng turbo table cell data from overlapping other cells, I tried to add - [style]=" {'overflow':'hidden' }" to : <tr> , <td> and <div>, and none of these elements solved the overlapping.. anyone have an idea how to solve that?

Upvotes: 0

Views: 1900

Answers (1)

JAC
JAC

Reputation: 295

Add class="ui-resizable-column" to each column and row. It prevents the data from other cells from overlapping into it (not it from overlapping into other rows), which is why in the example below, even the checkbox has it.

Example:

This will make the column headers not overlap: 

<th *ngFor="let col of columns" class="ui-resizable-column">
</th>
<th style="width: 2.25em" class="ui-resizable-column">
  <p-tableHeaderCheckbox></p-tableHeaderCheckbox>
</th>

Then you do the same for rows:

<td *ngFor="let col of columns" class="ui-resizable-column">
</td>
<td class="ui-resizable-column">
  <p-tableCheckbox [value]="selectedrow"></p-tableCheckbox>
</td>

Upvotes: 1

Related Questions