in my Vue js code below, i added print method and it's working good .. but, i wanted to remove padding from td and td in table but it's not applying. Also, i wanted to add font but it's not taking too. can someone help me in this please? thanks in advance
export default {
name: 'light-table',
components: {
loader
},
data() {
return {
globalOptions: {
name: '_blank',
specs: [
'fullscreen=no',
'scrollbars=yes'
],
styles: [
'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css',
'https://unpkg.com/kidlat-css/css/kidlat.css',
'https://fonts.googleapis.com/css2?family=Almarai&display=swap' //this font links
],
}
},
methods: { //function call the print
print() {
this.$htmlToPaper('printMe', this.globalOptions);
},}.table-bordered thead th{
vertical-align: bottom;
padding: 0px !important;
border-bottom: 2px solid #dee2e6;
} //not applying thr padding <div id="printMe" class="row" style="padding: 15px; font-family: 'Cairo', sans-serif !important;">
//font style not showing
<table class="table table-bordered">
<thead>
<tr class="tr-class">
<th>direction</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{Flats.directions}}</td>
</tr>
</tbody>
</table>
</div>