Bootstrap table without stripe / borders

Question

I\'m kinda stuck with a CSS problem while using Bootstrap. I\'m also using Angular JS with Angular UI.bootstrap (which might be part of the problem).

I\'m making a w

Answer 1

Most examples seem to be too specific and/or bloated.

Here was my trimmed down solution using Bootstrap 4.0.0 (4.1 includes .table-borderless but still alpha)...

.table-borderless th{border:0;}
.table-borderless td{border:0;}

Similar to many proposed solutions, but minimal bytes

Answer 2

Try this:

<table class='borderless'>

CSS

.borderless {
 border:none;
}

Note: What you were doing before was not working because your css code was targeting a table within your .borderless table (which probably didn't exist)

Answer 3

Use the border- class from Boostrap 4

<td class="border-0"></td>

or

<table class='table border-0'></table>

Be sure to end the class input with the last change you want to do.

Answer 4

In some cases, one must also use border-spacing in the table class, like:

border-spacing: 0 !important;

Answer 5

I know this is an old thread and that you've picked an answer, but I thought I'd post this as it is relevant for anyone else that is currently looking.

There is no reason to create new CSS rules, simply undo the current rules and the borders will disappear.

    .table>tbody>tr>th,
    .table>tbody>tr>td {
        border-top: 0;
    }

going forward, anything styled with

    .table

will show no borders.

Answer 6

I expanded the Bootstrap table styles as Davide Pastore did, but with that method the styles are applied to all child tables as well, and they don't apply to the footer.

A better solution would be imitating the core Bootstrap table styles, but with your new class:

.table-borderless>thead>tr>th
.table-borderless>thead>tr>td
.table-borderless>tbody>tr>th
.table-borderless>tbody>tr>td
.table-borderless>tfoot>tr>th
.table-borderless>tfoot>tr>td {
    border: none;
}

Then when you use <table class='table table-borderless'> only the specific table with the class will be bordered, not any table in the tree.