mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-10 07:37:27 +02:00
Code Issues Releases Wiki Activity

Generate series of .table-responsive-* classes to accomodate overflowing tables in a variety of screen sizes

Browse Source
This commit is contained in:
Patrick Yeo
2017-06-08 17:58:31 -07:00
committed by Mark Otto
parent f7eb3c98b2
commit f66fa3fa2b
1 changed files with 17 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
scss/_tables.scss
View File

@@ -153,12 +153,16 @@
// Responsive tables // Responsive tables
// //
// Add `.table-responsive` to `.table`s and we'll make them mobile friendly by // Generate series of `.table-responsive-*` classes for configuring the screen
// enabling horizontal scrolling. Only applies <768px. Everything above that // size of where your table will overflow.
// will display normally.
.table-responsive { .table-responsive {
@include media-breakpoint-down(md) { @each $breakpoint in map-keys($grid-breakpoints) {
$next: breakpoint-next($breakpoint, $grid-breakpoints);
$infix: breakpoint-infix($next, $grid-breakpoints);
&#{$infix} {
@include media-breakpoint-down($breakpoint) {
display: block; display: block;
width: 100%; width: 100%;
overflow-x: auto; overflow-x: auto;
@@ -169,4 +173,6 @@
border: 0; border: 0;
} }
} }
}
}
} }