Search code examples
csscss-tables

CSS table style calling class


I have some tables on my site.

The code in the style.css has default settings reads:

table,
th,
td {
    border: 1px solid rgba(0, 0, 0, 0.1);
}

table {
    border-collapse: separate;
    border-spacing: 0;
    border-width: 1px 0 0 1px;
    margin-bottom: 24px;
    width: 100%;
}

I have assigned a class to my table which I don't want to use these settings:

and tried to then implement :

table.checkmarkarray {
border-width: 0 0 0 0;
}

but it does not override the other value of border-width: 1px 0 0 1px;

how can I override this value? without changing the default value?


Solution

  • If you want to remove all borders from your table, you need to change the td properties on top of your table properties.

    table.checkmarkarray, table.checkmarkarray td {
        border: none;
    }
    

    See it in action