Scope tablet classes to tablets range only

Fixes #9128
This commit is contained in:
Mark Otto 2013-08-05 20:55:30 -07:00
parent 1d1e21aff6
commit db45a60cc8
4 changed files with 9 additions and 7 deletions

View File

@ -873,7 +873,7 @@ pre code {
width: 100%; width: 100%;
} }
@media (min-width: 768px) { @media (min-width: 768px) and (max-width: 991px) {
.container { .container {
max-width: 728px; max-width: 728px;
} }

File diff suppressed because one or more lines are too long

View File

@ -92,7 +92,7 @@
.col-12 { width: 100%; } .col-12 { width: 100%; }
// Small device columns (phones to tablets) // Small device columns (phones to tablets)
@media (min-width: @screen-tablet) { @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.container { .container {
max-width: @container-tablet; max-width: @container-tablet;
} }

View File

@ -197,14 +197,16 @@
@screen-medium: 992px; @screen-medium: 992px;
@screen-desktop: @screen-medium; @screen-desktop: @screen-medium;
// So media queries don't overlap when required, provide a maximum
@screen-small-max: (@screen-medium - 1);
@screen-tablet-max: @screen-small-max;
// Large screen / wide desktop // Large screen / wide desktop
@screen-large: 1200px; @screen-large: 1200px;
@screen-large-desktop: @screen-large; @screen-large-desktop: @screen-large;
// So media queries don't overlap when required, provide a maximum
@screen-small-max: (@screen-medium - 1);
@screen-tablet-max: (@screen-desktop - 1);
@screen-desktop-max: (@screen-large-desktop - 1);
// Grid system // Grid system
// -------------------------------------------------- // --------------------------------------------------