See the project README for contributions, credits and licensing.
Tables
.custom-table-bordered
Remove the columns border from a bordered table. Use .custom-table-bordered
with .table
and .table-bordered
.
Example
<table class="table table-bordered custom-table-bordered">
...
</table>
# |
First Name |
Last Name |
Username |
1 |
Alice |
Agostini |
alice |
2 |
Bob |
Niemans |
bob |
3 |
Charles |
Cowalsky |
charlie |
The code
// Use the .custom-table-bordered class to disable the columns borders.
// Note: .table and .table-bordered are required to use .custom-table-bordered
.table.table-bordered.custom-table-bordered {
td, th {
border-left-width: 0px;
&:first-child {
border-left-width: 1px;
}
}
}
.custom-table-headless
Remove the head from a table. Use .custom-table-headless
with .table
. You may also use it with .table-bordered
and .custom-table-bordered
.
Example
<table class="table custom-table-headless">
...
</table>
# |
First Name |
Last Name |
Username |
1 |
Alice |
Agostini |
alice |
2 |
Bob |
Niemans |
bob |
3 |
Charles |
Cowalsky |
charlie |
# |
First Name |
Last Name |
Username |
1 |
Alice |
Agostini |
alice |
2 |
Bob |
Niemans |
bob |
3 |
Charles |
Cowalsky |
charlie |
# |
First Name |
Last Name |
Username |
1 |
Alice |
Agostini |
alice |
2 |
Bob |
Niemans |
bob |
3 |
Charles |
Cowalsky |
charlie |
The code
// Remove the head from a .table
// See also .table-bordered, .custom-btn-bordered
// Note: .table is required to use .custom-table-headless
.table.custom-table-headless {
border-top: 0;
margin-top: 40px;
thead {
left: -9999px;
position: absolute;
}
tr:first-child {
td:first-child {
border-top-left-radius: 4px;
}
td:last-child {
border-top-right-radius: 4px;
}
}
}