Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

rowStyle height does not work for anything under 49px in height

See original GitHub issue

Describe the bug rowStyle={ height: ''} does not work properly. If you set the height to anything under 49 pixels this fails to render properly.

To Reproduce Steps to reproduce the behavior:

Create a new material table or go to https://material-table.com/#/docs/features/styling
Add options={{ rowStyle: { height: '10px'}} in your table or the example table in the official docs
See that the table row height does not change.

Expected behavior Previously this was working, if I set the row height to 10px it should apply that style.

Screenshots materialTableRowHeight

Desktop (please complete the following information):

OS: MacOS Mojave 10.14.4
Browser: Chrome
Version: 74.0.3729.169 (Official Build) (64-bit)
Browser: Firefox
Version: 66.0.5

Additional context There is nothing indicating that another style is overriding this rowStyle change, as shown in the screenshot provided.

Issue Analytics

State:
Created 4 years ago
Comments:5 (1 by maintainers)

Top GitHub Comments

3reactions

EdmarPereiracommented, Jan 23, 2020

I found a solution for my use, I need to edit this property to change the size of the table header and table body: .MuiTableCell-root { height: 10px !important; padding: 0px !important; font-size: 0.7rem !important; }

.MuiButtonBase-root{ height: 10px !important; }

with this you can adjust for you

1reaction

arash-sadrcommented, Oct 22, 2019

Hi @mbrn,

Thanks for taking up this enhancement. may I knw if there is any update about this issue? 😃

Top Results From Across the Web

Fixed height on <tr> when <table> height is 100%

"The height of the rows should be set at 49px instead of dividing themselves evenly to fill the entire space." Problems.

RowStyle.Height Property (System.Windows.Forms)

Gets or sets the height of a row. ... The Height property will take on different meanings depending on the SizeType property. The...

Column Header: Styling & Appearance Feature of our Datagrid

The height for the row containing the column label header. If not specified the default is 25px. groupHeaderHeight, The height for the rows...

Deep dive CSS: font metrics, line-height and vertical-align

An introduction to the inline formatting context. Explores line-height and vertical-align properties, as well as the font metrics. Understand how text is ......

CSS PX to EM Conversion - W3Schools

In the table below, select a body font size in pixels (px) to display a complete "px to em and percent" conversion table....