Editing input fields on small size datatable are not sized/aligned the same

UI Components for React
Post Reply
Posts: 3
Joined: 14 May 2021, 20:15

27 May 2021, 16:48

PrimeReact 6.3.2

When I have a DataTable with p-datatable-sm styling and row editing, the input fields/dropdowns do not have the same sizes or line up. I put in the following styles to make it look eyeball correct:

InputNumber style={{ paddingTop: '8px'}}
InputText style={{ marginTop: '8px'}}
Dropdown style={{ width: '100%', height: '35px' }}

.datatable-editing .editable-cells-table td.p-cell-editing {
padding-top: 0;
padding-bottom: 0;

.p-dropdown {
width: 6rem;

.p-inputtext {
width: 6rem;

I'm sure this is all sorts of wrong and would love to have the issue properly fixed in a PrimeReact update.

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests