github/bootstrap
1
1
Fork 0
mirror of https://github.com/jasny/bootstrap.git synced 2026-04-24 03:00:49 -04:00
Code Issues Packages Projects Releases Wiki Activity

Another grid update

Browse Source 
* Update docs to include table of grid levels and behaviors
* Change from .col-md to .col-sm to match existing size variables we use elsewhere
* Keep .col-lg as-is though for simplicity as we won't likely add a fourth level of the grid
* Combine responsive .container breakpoints with grid breakpoints in grid.less
* Other misc docs updates
This commit is contained in:
Mark Otto
2013-06-08 18:34:16 -02:30
parent b1cc11cd98
commit 441bbe1998
4 changed files with 130 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
docs/assets/css/bootstrap.css vendored
View File

@@ -787,6 +787,18 @@ pre code {
.col-10,
.col-11,
.col-12,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-lg-1,
.col-lg-2,
.col-lg-3,
@@ -856,40 +868,43 @@ pre code {
}
@media (min-width: 768px) {
.col-md-1 {
.container {
max-width: 728px;
}
.col-sm-1 {
width: 8.333333333333332%;
}
.col-md-2 {
.col-sm-2 {
width: 16.666666666666664%;
}
.col-md-3 {
.col-sm-3 {
width: 25%;
}
.col-md-4 {
.col-sm-4 {
width: 33.33333333333333%;
}
.col-md-5 {
.col-sm-5 {
width: 41.66666666666667%;
}
.col-md-6 {
.col-sm-6 {
width: 50%;
}
.col-md-7 {
.col-sm-7 {
width: 58.333333333333336%;
}
.col-md-8 {
.col-sm-8 {
width: 66.66666666666666%;
}
.col-md-9 {
.col-sm-9 {
width: 75%;
}
.col-md-10 {
.col-sm-10 {
width: 83.33333333333334%;
}
.col-md-11 {
.col-sm-11 {
width: 91.66666666666666%;
}
.col-md-12 {
.col-sm-12 {
width: 100%;
}
.col-offset-1 {
@@ -994,6 +1009,9 @@ pre code {
}
@media (min-width: 992px) {
.container {
max-width: 940px;
}
.col-lg-1 {
width: 8.333333333333332%;
}
@@ -1032,19 +1050,7 @@ pre code {
}
}
@media screen and (min-width: 768px) {
.container {
max-width: 728px;
}
}
@media screen and (min-width: 992px) {
.container {
max-width: 940px;
}
}
@media screen and (min-width: 1200px) {
@media (min-width: 1200px) {
.container {
max-width: 1170px;
}