CODEWITHSUNDEEP
twitter-bootstraphtml-tableborderbootswatch
user1079404
user1079404

Reputation: 308

Why isn't the border working in this Bootstrap 3 table?

With the base Bootstrap 3 CSS it seems to work fine, but with the Superhero Bootswatch theme it seems that border just doesn't want to appear. Any idea why?

http://jsfiddle.net/VxR7z/

<table class="table table-bordered">
  ...
</table>

Should work on all themes.

Upvotes: 4

Views: 7588

Answers (3)

Ousama
Ousama

Reputation: 2800

I solved this issue by just adding !import :

table.table-bordered {
    border: 1px solid black !important;
    margin-top: 20px;
}
table.table-bordered > thead > tr > th {
    border: 1px solid black !important;
}
table.table-bordered > tbody > tr > td {
    border: 1px solid black !important;
}

Upvotes: 1

mike
mike

Reputation: 113

Several of the bootswatch themes that I've seen set @table-border-color to transparent to completely remove horizontal borders i.e. 

@table-border-color: rgba(221, 221, 221,0)

Unfortunately this does "break" the table-bordered table. Without customizing the core bootstrap less files, I think the easiest way to do this is to override with your own css as suggested, i.e.

.table-bordered th, .table-bordered td { border: 1px solid #ddd!important }

Upvotes: 2

sunilkjt
sunilkjt

Reputation: 1005

Just add this code with your desired color at border

.table-bordered th, .table-bordered td { border: 1px solid #ddd!important }

Thanks

Upvotes: 12

Related Questions