You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
After updating to reactable 0.3.0 from version 0.2.3, my tables suddenly seemed to have much more whitespace between individual cells. My code didn't change. It looks like the culprit is .rt-td-inner, which has extra padding and was introduced in commit d1ecacd (I assume this is in reactable.css. My old code just had a div <div class="rt-td rt-align-center"> with the content of the cell inside. In the new version, this div now first contains a <div class="rt-td-inner"> which contains the actual content of that cell.
I assume I can probably just fix it by setting padding to 0 for .rt-td-inner? I may have missed it, but shouldn't this have been documented as a breaking change?
The text was updated successfully, but these errors were encountered:
Hi, this shouldn't have been a breaking change as the padding was moved from the outer cell element to the new inner cell wrapper, and still the same in total. But I can see how this change could have broken tables that had custom padding styles on its cells, applied with custom CSS instead of reactableTheme(cellPadding = "..."). I think a few older examples had done this before, and I had changed them to use reactableTheme() a while back. If this is what your table had done, I'm sorry about that, I can retroactively document that as a breaking change in the 0.3.0 NEWS.
To fix this, I'd suggest using reactableTheme(cellPadding = "...") instead of custom CSS, like in this theming example. Setting padding to 0 on .rt-td-inner could also work, but reactable's CSS classes are undocumented and subject to change, so I definitely recommend using the theme approach if possible.
After updating to reactable 0.3.0 from version 0.2.3, my tables suddenly seemed to have much more whitespace between individual cells. My code didn't change. It looks like the culprit is .rt-td-inner, which has extra padding and was introduced in commit d1ecacd (I assume this is in reactable.css. My old code just had a div
<div class="rt-td rt-align-center">
with the content of the cell inside. In the new version, this div now first contains a<div class="rt-td-inner">
which contains the actual content of that cell.I assume I can probably just fix it by setting padding to 0 for
.rt-td-inner
? I may have missed it, but shouldn't this have been documented as a breaking change?The text was updated successfully, but these errors were encountered: