0

We are using lightning-datatable. lightning-datatable has slds-card__body class. marginBottom is part of slds-card__body class.

I want to make marginBottom zero. I try the below code but it did not work for me.

enter image description here

:host {
    --sds-c-card__body-margin-bottom: 0;
    --sds-c-card-body-margin-bottom: 0;
    --slds-c-card-body-margin-bottom: 0;
    --slds-c-card__body-margin-bottom: 0;
}
.slds-card__body {
    margin-bottom: 0 !important;
}

1 Answer 1

1

we have to override CSS of standard lwc component :

Create a CSS file and add in static resource File Content :

.slds-card__body {
    margin-bottom: 0 !important;
}

Import That static resource file in your component

import { loadStyle } from 'lightning/platformResourceLoader';
import CUSTOMCSS from '@salesforce/resourceUrl/{yourfileName}';

a) Define variable like : isCssLoaded = false;

Call it in reRenderCallback

renderedCallback(){

if(this.isCssLoaded) return
this.isCssLoaded = true;
loadStyle(this,CUSTOMCSS).then(()=>{
    console.log('loaded');
})
.catch(error=>{
    console.log('error to load');
});
}

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .