Thanks for helping. but it don’t working correctly.

When the page is laoding and the grid is empty than it has a correct width.

After I push a button on the page for loading my grid data from database. I build the gridc olumns dynamically depend of the loaded database data.

The table does not keep its width but grows until all columns in the table are visible.
But the table should keep its predefined width and a horizontal scrollbar should be displayed if not all columns are visible.


The div Tag fit to the page width but the grid not with new inserted columns.

Here the code:

<div class=”border border-primary rounded p-2 my-auto bg-light”>
<Grid id=”grid” @ref=”grid” DataSource=”@listGridData” ColumnGroups=”_colGroups” Columns=”@_columns” Paging=”@paging” Pager=”@pager”></Grid>

#grid {
width: 100%;
height: 500px;