Add custom style td th in vue-good-table

Question

Question Im using vue version 2.21.11?

What browser? Google Chrome

I want to add a td and th and add a style to it .

When I trigger a print, the data is compressed to each other almost no spacing .

I already add a custom class to the columns I saw the changes on the page but when I print it the output is different . Please see picture for reference .

    [![<style>
.thClass{
    border: 0px;
    font-size: 100%;
    margin-right: 100px;
    margin-bottom: 100px;
    text-align: center;
    }
    .tdClass{
    border: 0px;
    font-size: 100%;
    margin-right: 100px;
    margin-bottom: 100px;
    text-align: center;
    }
    
    </style>
    And this is for the columns
    
    columns: [
    {
    label: '',
    field: 'product_quantity',
    width: '10%',
    thClass: 'thClass',
    tdClass: 'tdClass'
    },

Answer 1

try using @media print in your .tdClass css