I'm trying to set max-height
property to slds-scrollable_y
class inside lighting-datatable
web component via css with:
.slds-crollable_y{
max-height: 10rem !important;
}
But it's not working. Is it even possible to overwrite standard lwc css as it was in aura?
Best Answer
No. Because of CSS Isolation, you can't generally monkey with the internals of a component, especially if it's in another namespace. The documentation says:
There is currently a loadStyle hack that works around this, but I expect it will eventually be fixed.
You should be able to specify a height for the entire table, which should auto-size the inner table accordingly:
This is because the Shadow DOM allows us to modify the "outside" of the component, such as its size, a border, etc, while not allowing us to modify the internal components.