We are updating PrimeReact version 8.6.1, but we are facing an issue in Datatable responsive mode.
Below dynamically generating CSS properties are override the default CSS.
can we disable pr_id_xx from datatable ?
can you please check the code snippet below and suggest how to resolve the issue?
Data table
Code: Select all
<DataTable responsiveLayout="stack" ........ />
how to prevent generating dynamically CSS?
Code: Select all
@media screen and (max-width: 960px) {
.p-datatable[pr_id_2] .p-datatable-thead > tr > th,
.p-datatable[pr_id_2] .p-datatable-tfoot > tr > td {
[b]display: none !important;[/b]
}
.p-datatable[pr_id_2] .p-datatable-tbody > tr > td {
[b] display: flex;[/b]
width: 100% !important;
align-items: center;
justify-content: space-between;
}
.p-datatable[pr_id_2] .p-datatable-tbody > tr > td:not(:last-child) {
border: 0 none;
}
.p-datatable[pr_id_2].p-datatable-gridlines .p-datatable-tbody > tr > td:last-child {
border-top: 0;
border-right: 0;
border-left: 0;
}
.p-datatable[pr_id_2] .p-datatable-tbody > tr > td > .p-column-title {
display: block;
}
}