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

remake the box-size grid, nuke fluid grid docs, fix up examples, clean up form styles

Browse Source
This commit is contained in:
Mark Otto
2012-08-28 13:33:06 -07:00
parent e27b1355b5
commit 0b122bc5c5
10 changed files with 238 additions and 1299 deletions
Download Patch File Download Diff File Expand all files Collapse all files

692
docs/assets/css/bootstrap-responsive.css vendored
View File

@@ -92,8 +92,14 @@
}
@media (min-width: 1200px) {
.container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1170px;
}
.row {
margin-left: -30px;
margin-right: -15px;
margin-left: -15px;
*zoom: 1;
}
.row:before,
@@ -108,324 +114,83 @@
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 30px;
}
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1170px;
}
.span12 {
width: 1170px;
}
.span11 {
width: 1070px;
}
.span10 {
width: 970px;
}
.span9 {
width: 870px;
}
.span8 {
width: 770px;
}
.span7 {
width: 670px;
}
.span6 {
width: 570px;
}
.span5 {
width: 470px;
}
.span4 {
width: 370px;
}
.span3 {
width: 270px;
}
.span2 {
width: 170px;
}
.span1 {
width: 70px;
}
.offset12 {
margin-left: 1230px;
}
.offset11 {
margin-left: 1130px;
}
.offset10 {
margin-left: 1030px;
}
.offset9 {
margin-left: 930px;
}
.offset8 {
margin-left: 830px;
}
.offset7 {
margin-left: 730px;
}
.offset6 {
margin-left: 630px;
}
.offset5 {
margin-left: 530px;
}
.offset4 {
margin-left: 430px;
}
.offset3 {
margin-left: 330px;
}
.offset2 {
margin-left: 230px;
}
.offset1 {
margin-left: 130px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
display: table;
line-height: 0;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid [class*="span"] {
display: block;
float: left;
width: 100%;
min-height: 30px;
margin-left: 2.564102564102564%;
*margin-left: 2.5109110747408616%;
padding-right: 15px;
padding-left: 15px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.row-fluid [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .span12 {
.span12 {
width: 100%;
*width: 99.94680851063829%;
}
.row-fluid .span11 {
width: 91.45299145299145%;
*width: 91.39979996362975%;
.span11 {
width: 91.66666666666666%;
}
.row-fluid .span10 {
width: 82.90598290598291%;
*width: 82.8527914166212%;
.span10 {
width: 83.33333333333334%;
}
.row-fluid .span9 {
width: 74.35897435897436%;
*width: 74.30578286961266%;
.span9 {
width: 75%;
}
.row-fluid .span8 {
width: 65.81196581196582%;
*width: 65.75877432260411%;
.span8 {
width: 66.66666666666666%;
}
.row-fluid .span7 {
width: 57.26495726495726%;
*width: 57.21176577559556%;
.span7 {
width: 58.333333333333336%;
}
.row-fluid .span6 {
width: 48.717948717948715%;
*width: 48.664757228587014%;
.span6 {
width: 50%;
}
.row-fluid .span5 {
width: 40.17094017094017%;
*width: 40.11774868157847%;
.span5 {
width: 41.66666666666667%;
}
.row-fluid .span4 {
width: 31.623931623931625%;
*width: 31.570740134569924%;
.span4 {
width: 33.33333333333333%;
}
.row-fluid .span3 {
width: 23.076923076923077%;
*width: 23.023731587561375%;
.span3 {
width: 25%;
}
.row-fluid .span2 {
width: 14.52991452991453%;
*width: 14.476723040552828%;
.span2 {
width: 16.666666666666664%;
}
.row-fluid .span1 {
width: 5.982905982905983%;
*width: 5.929714493544281%;
.span1 {
width: 8.333333333333332%;
}
.row-fluid .offset12 {
margin-left: 105.12820512820512%;
*margin-left: 105.02182214948171%;
.offset12 {
margin-left: 100%;
}
.row-fluid .offset12:first-child {
margin-left: 102.56410256410257%;
*margin-left: 102.45771958537915%;
.offset11 {
margin-left: 91.66666666666666%;
}
.row-fluid .offset11 {
margin-left: 96.58119658119658%;
*margin-left: 96.47481360247316%;
.offset10 {
margin-left: 83.33333333333334%;
}
.row-fluid .offset11:first-child {
margin-left: 94.01709401709402%;
*margin-left: 93.91071103837061%;
.offset9 {
margin-left: 75%;
}
.row-fluid .offset10 {
margin-left: 88.03418803418803%;
*margin-left: 87.92780505546462%;
.offset8 {
margin-left: 66.66666666666666%;
}
.row-fluid .offset10:first-child {
margin-left: 85.47008547008548%;
*margin-left: 85.36370249136206%;
.offset7 {
margin-left: 58.333333333333336%;
}
.row-fluid .offset9 {
margin-left: 79.48717948717949%;
*margin-left: 79.38079650845607%;
.offset6 {
margin-left: 50%;
}
.row-fluid .offset9:first-child {
margin-left: 76.92307692307693%;
*margin-left: 76.81669394435352%;
.offset5 {
margin-left: 41.66666666666667%;
}
.row-fluid .offset8 {
margin-left: 70.94017094017094%;
*margin-left: 70.83378796144753%;
.offset4 {
margin-left: 33.33333333333333%;
}
.row-fluid .offset8:first-child {
margin-left: 68.37606837606839%;
*margin-left: 68.26968539734497%;
.offset3 {
margin-left: 25%;
}
.row-fluid .offset7 {
margin-left: 62.393162393162385%;
*margin-left: 62.28677941443899%;
.offset2 {
margin-left: 16.666666666666664%;
}
.row-fluid .offset7:first-child {
margin-left: 59.82905982905982%;
*margin-left: 59.72267685033642%;
}
.row-fluid .offset6 {
margin-left: 53.84615384615384%;
*margin-left: 53.739770867430444%;
}
.row-fluid .offset6:first-child {
margin-left: 51.28205128205128%;
*margin-left: 51.175668303327875%;
}
.row-fluid .offset5 {
margin-left: 45.299145299145295%;
*margin-left: 45.1927623204219%;
}
.row-fluid .offset5:first-child {
margin-left: 42.73504273504273%;
*margin-left: 42.62865975631933%;
}
.row-fluid .offset4 {
margin-left: 36.75213675213675%;
*margin-left: 36.645753773413354%;
}
.row-fluid .offset4:first-child {
margin-left: 34.18803418803419%;
*margin-left: 34.081651209310785%;
}
.row-fluid .offset3 {
margin-left: 28.205128205128204%;
*margin-left: 28.0987452264048%;
}
.row-fluid .offset3:first-child {
margin-left: 25.641025641025642%;
*margin-left: 25.53464266230224%;
}
.row-fluid .offset2 {
margin-left: 19.65811965811966%;
*margin-left: 19.551736679396257%;
}
.row-fluid .offset2:first-child {
margin-left: 17.094017094017094%;
*margin-left: 16.98763411529369%;
}
.row-fluid .offset1 {
margin-left: 11.11111111111111%;
*margin-left: 11.004728132387708%;
}
.row-fluid .offset1:first-child {
margin-left: 8.547008547008547%;
*margin-left: 8.440625568285142%;
}
input,
textarea,
.uneditable-input {
margin-left: 0;
}
.controls-row [class*="span"] + [class*="span"] {
margin-left: 30px;
}
input.span12,
textarea.span12,
.uneditable-input.span12 {
width: 1156px;
}
input.span11,
textarea.span11,
.uneditable-input.span11 {
width: 1056px;
}
input.span10,
textarea.span10,
.uneditable-input.span10 {
width: 956px;
}
input.span9,
textarea.span9,
.uneditable-input.span9 {
width: 856px;
}
input.span8,
textarea.span8,
.uneditable-input.span8 {
width: 756px;
}
input.span7,
textarea.span7,
.uneditable-input.span7 {
width: 656px;
}
input.span6,
textarea.span6,
.uneditable-input.span6 {
width: 556px;
}
input.span5,
textarea.span5,
.uneditable-input.span5 {
width: 456px;
}
input.span4,
textarea.span4,
.uneditable-input.span4 {
width: 356px;
}
input.span3,
textarea.span3,
.uneditable-input.span3 {
width: 256px;
}
input.span2,
textarea.span2,
.uneditable-input.span2 {
width: 156px;
}
input.span1,
textarea.span1,
.uneditable-input.span1 {
width: 56px;
.offset1 {
margin-left: 8.333333333333332%;
}
.thumbnails {
margin-left: -30px;
@@ -433,14 +198,12 @@
.thumbnails > li {
margin-left: 30px;
}
.row-fluid .thumbnails {
margin-left: 0;
}
}
@media (min-width: 768px) and (max-width: 979px) {
.row {
margin-left: -20px;
margin-right: -10px;
margin-left: -10px;
*zoom: 1;
}
.row:before,
@@ -455,324 +218,83 @@
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 20px;
}
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 724px;
}
.span12 {
width: 724px;
}
.span11 {
width: 662px;
}
.span10 {
width: 600px;
}
.span9 {
width: 538px;
}
.span8 {
width: 476px;
}
.span7 {
width: 414px;
}
.span6 {
width: 352px;
}
.span5 {
width: 290px;
}
.span4 {
width: 228px;
}
.span3 {
width: 166px;
}
.span2 {
width: 104px;
}
.span1 {
width: 42px;
}
.offset12 {
margin-left: 764px;
}
.offset11 {
margin-left: 702px;
}
.offset10 {
margin-left: 640px;
}
.offset9 {
margin-left: 578px;
}
.offset8 {
margin-left: 516px;
}
.offset7 {
margin-left: 454px;
}
.offset6 {
margin-left: 392px;
}
.offset5 {
margin-left: 330px;
}
.offset4 {
margin-left: 268px;
}
.offset3 {
margin-left: 206px;
}
.offset2 {
margin-left: 144px;
}
.offset1 {
margin-left: 82px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
display: table;
line-height: 0;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid [class*="span"] {
display: block;
float: left;
width: 100%;
min-height: 30px;
margin-left: 2.7624309392265194%;
*margin-left: 2.709239449864817%;
padding-right: 10px;
padding-left: 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.row-fluid [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .span12 {
.span12 {
width: 100%;
*width: 99.94680851063829%;
}
.row-fluid .span11 {
width: 91.43646408839778%;
*width: 91.38327259903608%;
.span11 {
width: 91.66666666666666%;
}
.row-fluid .span10 {
width: 82.87292817679558%;
*width: 82.81973668743387%;
.span10 {
width: 83.33333333333334%;
}
.row-fluid .span9 {
width: 74.30939226519337%;
*width: 74.25620077583166%;
.span9 {
width: 75%;
}
.row-fluid .span8 {
width: 65.74585635359117%;
*width: 65.69266486422946%;
.span8 {
width: 66.66666666666666%;
}
.row-fluid .span7 {
width: 57.18232044198895%;
*width: 57.12912895262725%;
.span7 {
width: 58.333333333333336%;
}
.row-fluid .span6 {
width: 48.61878453038674%;
*width: 48.56559304102504%;
.span6 {
width: 50%;
}
.row-fluid .span5 {
width: 40.05524861878453%;
*width: 40.00205712942283%;
.span5 {
width: 41.66666666666667%;
}
.row-fluid .span4 {
width: 31.491712707182323%;
*width: 31.43852121782062%;
.span4 {
width: 33.33333333333333%;
}
.row-fluid .span3 {
width: 22.92817679558011%;
*width: 22.87498530621841%;
.span3 {
width: 25%;
}
.row-fluid .span2 {
width: 14.3646408839779%;
*width: 14.311449394616199%;
.span2 {
width: 16.666666666666664%;
}
.row-fluid .span1 {
width: 5.801104972375691%;
*width: 5.747913483013988%;
.span1 {
width: 8.333333333333332%;
}
.row-fluid .offset12 {
margin-left: 105.52486187845304%;
*margin-left: 105.41847889972962%;
.offset12 {
margin-left: 100%;
}
.row-fluid .offset12:first-child {
margin-left: 102.76243093922652%;
*margin-left: 102.6560479605031%;
.offset11 {
margin-left: 91.66666666666666%;
}
.row-fluid .offset11 {
margin-left: 96.96132596685082%;
*margin-left: 96.8549429881274%;
.offset10 {
margin-left: 83.33333333333334%;
}
.row-fluid .offset11:first-child {
margin-left: 94.1988950276243%;
*margin-left: 94.09251204890089%;
.offset9 {
margin-left: 75%;
}
.row-fluid .offset10 {
margin-left: 88.39779005524862%;
*margin-left: 88.2914070765252%;
.offset8 {
margin-left: 66.66666666666666%;
}
.row-fluid .offset10:first-child {
margin-left: 85.6353591160221%;
*margin-left: 85.52897613729868%;
.offset7 {
margin-left: 58.333333333333336%;
}
.row-fluid .offset9 {
margin-left: 79.8342541436464%;
*margin-left: 79.72787116492299%;
.offset6 {
margin-left: 50%;
}
.row-fluid .offset9:first-child {
margin-left: 77.07182320441989%;
*margin-left: 76.96544022569647%;
.offset5 {
margin-left: 41.66666666666667%;
}
.row-fluid .offset8 {
margin-left: 71.2707182320442%;
*margin-left: 71.16433525332079%;
.offset4 {
margin-left: 33.33333333333333%;
}
.row-fluid .offset8:first-child {
margin-left: 68.50828729281768%;
*margin-left: 68.40190431409427%;
.offset3 {
margin-left: 25%;
}
.row-fluid .offset7 {
margin-left: 62.70718232044199%;
*margin-left: 62.600799341718584%;
.offset2 {
margin-left: 16.666666666666664%;
}
.row-fluid .offset7:first-child {
margin-left: 59.94475138121547%;
*margin-left: 59.838368402492065%;
}
.row-fluid .offset6 {
margin-left: 54.14364640883978%;
*margin-left: 54.037263430116376%;
}
.row-fluid .offset6:first-child {
margin-left: 51.38121546961326%;
*margin-left: 51.27483249088986%;
}
.row-fluid .offset5 {
margin-left: 45.58011049723757%;
*margin-left: 45.47372751851417%;
}
.row-fluid .offset5:first-child {
margin-left: 42.81767955801105%;
*margin-left: 42.71129657928765%;
}
.row-fluid .offset4 {
margin-left: 37.01657458563536%;
*margin-left: 36.91019160691196%;
}
.row-fluid .offset4:first-child {
margin-left: 34.25414364640884%;
*margin-left: 34.14776066768544%;
}
.row-fluid .offset3 {
margin-left: 28.45303867403315%;
*margin-left: 28.346655695309746%;
}
.row-fluid .offset3:first-child {
margin-left: 25.69060773480663%;
*margin-left: 25.584224756083227%;
}
.row-fluid .offset2 {
margin-left: 19.88950276243094%;
*margin-left: 19.783119783707537%;
}
.row-fluid .offset2:first-child {
margin-left: 17.12707182320442%;
*margin-left: 17.02068884448102%;
}
.row-fluid .offset1 {
margin-left: 11.32596685082873%;
*margin-left: 11.219583872105325%;
}
.row-fluid .offset1:first-child {
margin-left: 8.56353591160221%;
*margin-left: 8.457152932878806%;
}
input,
textarea,
.uneditable-input {
margin-left: 0;
}
.controls-row [class*="span"] + [class*="span"] {
margin-left: 20px;
}
input.span12,
textarea.span12,
.uneditable-input.span12 {
width: 710px;
}
input.span11,
textarea.span11,
.uneditable-input.span11 {
width: 648px;
}
input.span10,
textarea.span10,
.uneditable-input.span10 {
width: 586px;
}
input.span9,
textarea.span9,
.uneditable-input.span9 {
width: 524px;
}
input.span8,
textarea.span8,
.uneditable-input.span8 {
width: 462px;
}
input.span7,
textarea.span7,
.uneditable-input.span7 {
width: 400px;
}
input.span6,
textarea.span6,
.uneditable-input.span6 {
width: 338px;
}
input.span5,
textarea.span5,
.uneditable-input.span5 {
width: 276px;
}
input.span4,
textarea.span4,
.uneditable-input.span4 {
width: 214px;
}
input.span3,
textarea.span3,
.uneditable-input.span3 {
width: 152px;
}
input.span2,
textarea.span2,
.uneditable-input.span2 {
width: 90px;
}
input.span1,
textarea.span1,
.uneditable-input.span1 {
width: 28px;
.offset1 {
margin-left: 8.333333333333332%;
}
}

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

@@ -197,8 +197,15 @@ a:hover {
border-radius: 500px;
}
.container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
.row {
margin-left: -20px;
margin-right: -10px;
margin-left: -10px;
*zoom: 1;
}
@@ -216,322 +223,107 @@ a:hover {
[class*="span"] {
float: left;
min-height: 1px;
margin-left: 20px;
}
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
.span12 {
width: 940px;
}
.span11 {
width: 860px;
}
.span10 {
width: 780px;
}
.span9 {
width: 700px;
}
.span8 {
width: 620px;
}
.span7 {
width: 540px;
}
.span6 {
width: 460px;
}
.span5 {
width: 380px;
}
.span4 {
width: 300px;
}
.span3 {
width: 220px;
}
.span2 {
width: 140px;
}
.span1 {
width: 60px;
}
.offset12 {
margin-left: 980px;
}
.offset11 {
margin-left: 900px;
}
.offset10 {
margin-left: 820px;
}
.offset9 {
margin-left: 740px;
}
.offset8 {
margin-left: 660px;
}
.offset7 {
margin-left: 580px;
}
.offset6 {
margin-left: 500px;
}
.offset5 {
margin-left: 420px;
}
.offset4 {
margin-left: 340px;
}
.offset3 {
margin-left: 260px;
}
.offset2 {
margin-left: 180px;
}
.offset1 {
margin-left: 100px;
}
.row-fluid {
width: 100%;
*zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
display: table;
line-height: 0;
content: "";
}
.row-fluid:after {
clear: both;
}
.row-fluid [class*="span"] {
display: block;
float: left;
width: 100%;
min-height: 30px;
margin-left: 2.127659574468085%;
*margin-left: 2.074468085106383%;
padding-right: 10px;
padding-left: 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.row-fluid [class*="span"]:first-child {
margin-left: 0;
}
.row-fluid .span12 {
.span12 {
width: 100%;
*width: 99.94680851063829%;
}
.row-fluid .span11 {
width: 91.48936170212765%;
*width: 91.43617021276594%;
.span11 {
width: 91.66666666666666%;
}
.row-fluid .span10 {
width: 82.97872340425532%;
*width: 82.92553191489361%;
.span10 {
width: 83.33333333333334%;
}
.row-fluid .span9 {
width: 74.46808510638297%;
*width: 74.41489361702126%;
.span9 {
width: 75%;
}
.row-fluid .span8 {
width: 65.95744680851064%;
*width: 65.90425531914893%;
.span8 {
width: 66.66666666666666%;
}
.row-fluid .span7 {
width: 57.44680851063829%;
*width: 57.39361702127659%;
.span7 {
width: 58.333333333333336%;
}
.row-fluid .span6 {
width: 48.93617021276595%;
*width: 48.88297872340425%;
.span6 {
width: 50%;
}
.row-fluid .span5 {
width: 40.42553191489362%;
*width: 40.37234042553192%;
.span5 {
width: 41.66666666666667%;
}
.row-fluid .span4 {
width: 31.914893617021278%;
*width: 31.861702127659576%;
.span4 {
width: 33.33333333333333%;
}
.row-fluid .span3 {
width: 23.404255319148934%;
*width: 23.351063829787233%;
.span3 {
width: 25%;
}
.row-fluid .span2 {
width: 14.893617021276595%;
*width: 14.840425531914894%;
.span2 {
width: 16.666666666666664%;
}
.row-fluid .span1 {
width: 6.382978723404255%;
*width: 6.329787234042553%;
.span1 {
width: 8.333333333333332%;
}
.row-fluid .offset12 {
margin-left: 104.25531914893617%;
*margin-left: 104.14893617021275%;
.offset12 {
margin-left: 100%;
}
.row-fluid .offset12:first-child {
margin-left: 102.12765957446808%;
*margin-left: 102.02127659574467%;
.offset11 {
margin-left: 91.66666666666666%;
}
.row-fluid .offset11 {
margin-left: 95.74468085106382%;
*margin-left: 95.6382978723404%;
.offset10 {
margin-left: 83.33333333333334%;
}
.row-fluid .offset11:first-child {
margin-left: 93.61702127659574%;
*margin-left: 93.51063829787232%;
.offset9 {
margin-left: 75%;
}
.row-fluid .offset10 {
margin-left: 87.23404255319149%;
*margin-left: 87.12765957446807%;
.offset8 {
margin-left: 66.66666666666666%;
}
.row-fluid .offset10:first-child {
margin-left: 85.1063829787234%;
*margin-left: 84.99999999999999%;
.offset7 {
margin-left: 58.333333333333336%;
}
.row-fluid .offset9 {
margin-left: 78.72340425531914%;
*margin-left: 78.61702127659572%;
.offset6 {
margin-left: 50%;
}
.row-fluid .offset9:first-child {
margin-left: 76.59574468085106%;
*margin-left: 76.48936170212764%;
.offset5 {
margin-left: 41.66666666666667%;
}
.row-fluid .offset8 {
margin-left: 70.2127659574468%;
*margin-left: 70.10638297872339%;
.offset4 {
margin-left: 33.33333333333333%;
}
.row-fluid .offset8:first-child {
margin-left: 68.08510638297872%;
*margin-left: 67.9787234042553%;
.offset3 {
margin-left: 25%;
}
.row-fluid .offset7 {
margin-left: 61.70212765957446%;
*margin-left: 61.59574468085106%;
.offset2 {
margin-left: 16.666666666666664%;
}
.row-fluid .offset7:first-child {
margin-left: 59.574468085106375%;
*margin-left: 59.46808510638297%;
}
.row-fluid .offset6 {
margin-left: 53.191489361702125%;
*margin-left: 53.085106382978715%;
}
.row-fluid .offset6:first-child {
margin-left: 51.063829787234035%;
*margin-left: 50.95744680851063%;
}
.row-fluid .offset5 {
margin-left: 44.68085106382979%;
*margin-left: 44.57446808510638%;
}
.row-fluid .offset5:first-child {
margin-left: 42.5531914893617%;
*margin-left: 42.4468085106383%;
}
.row-fluid .offset4 {
margin-left: 36.170212765957444%;
*margin-left: 36.06382978723405%;
}
.row-fluid .offset4:first-child {
margin-left: 34.04255319148936%;
*margin-left: 33.93617021276596%;
}
.row-fluid .offset3 {
margin-left: 27.659574468085104%;
*margin-left: 27.5531914893617%;
}
.row-fluid .offset3:first-child {
margin-left: 25.53191489361702%;
*margin-left: 25.425531914893618%;
}
.row-fluid .offset2 {
margin-left: 19.148936170212764%;
*margin-left: 19.04255319148936%;
}
.row-fluid .offset2:first-child {
margin-left: 17.02127659574468%;
*margin-left: 16.914893617021278%;
}
.row-fluid .offset1 {
margin-left: 10.638297872340425%;
*margin-left: 10.53191489361702%;
}
.row-fluid .offset1:first-child {
margin-left: 8.51063829787234%;
*margin-left: 8.404255319148938%;
.offset1 {
margin-left: 8.333333333333332%;
}
[class*="span"].hide,
@@ -1188,86 +980,11 @@ textarea[class*="span"],
display: inline-block;
}
input,
textarea,
.uneditable-input {
margin-left: 0;
}
.controls-row [class*="span"] + [class*="span"] {
margin-left: 20px;
}
input.span12,
textarea.span12,
.uneditable-input.span12 {
width: 926px;
}
input.span11,
textarea.span11,
.uneditable-input.span11 {
width: 846px;
}
input.span10,
textarea.span10,
.uneditable-input.span10 {
width: 766px;
}
input.span9,
textarea.span9,
.uneditable-input.span9 {
width: 686px;
}
input.span8,
textarea.span8,
.uneditable-input.span8 {
width: 606px;
}
input.span7,
textarea.span7,
.uneditable-input.span7 {
width: 526px;
}
input.span6,
textarea.span6,
.uneditable-input.span6 {
width: 446px;
}
input.span5,
textarea.span5,
.uneditable-input.span5 {
width: 366px;
}
input.span4,
textarea.span4,
.uneditable-input.span4 {
width: 286px;
}
input.span3,
textarea.span3,
.uneditable-input.span3 {
width: 206px;
}
input.span2,
textarea.span2,
.uneditable-input.span2 {
width: 126px;
}
input.span1,
textarea.span1,
.uneditable-input.span1 {
width: 46px;
input[class*="span"],
select[class*="span"],
textarea[class*="span"],
.uneditable-input[class*="span"] {
height: 30px;
}
.controls-row {
@@ -4322,7 +4039,7 @@ input[type="submit"].btn.btn-mini {
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
width: 100%;
}
.navbar-fixed-top {

137
docs/scaffolding.html
View File

@@ -87,7 +87,6 @@
<ul class="nav nav-list bs-docs-sidenav">
<li><a href="#global"><i class="icon-chevron-right"></i> Global styles</a></li>
<li><a href="#gridSystem"><i class="icon-chevron-right"></i> Grid system</a></li>
<li><a href="#fluidGridSystem"><i class="icon-chevron-right"></i> Fluid grid system</a></li>
<li><a href="#layouts"><i class="icon-chevron-right"></i> Layouts</a></li>
<li><a href="#responsive"><i class="icon-chevron-right"></i> Responsive design</a></li>
</ul>
@@ -150,18 +149,21 @@
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row show-grid">
<div class="span2">2</div>
<div class="span3">3</div>
<div class="span4">4</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row show-grid">
<div class="span4">4</div>
<div class="span5">5</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row show-grid">
<div class="span9">9</div>
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row show-grid">
<div class="span12">12</div>
</div>
</div>
@@ -180,33 +182,34 @@
<div class="bs-docs-grid">
<div class="row show-grid">
<div class="span4">4</div>
<div class="span3 offset2">3 offset 2</div>
<div class="span4 offset4">4 offset 4</div>
</div><!-- /row -->
<div class="row show-grid">
<div class="span3 offset1">3 offset 1</div>
<div class="span3 offset2">3 offset 2</div>
<div class="span3 offset3">3 offset 3</div>
<div class="span3 offset3">3 offset 3</div>
</div><!-- /row -->
<div class="row show-grid">
<div class="span6 offset3">6 offset 3</div>
<div class="span6 offset6">6 offset 6</div>
</div><!-- /row -->
</div>
<pre class="prettyprint linenums">
&lt;div class="row"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span3 offset2"&gt;...&lt;/div&gt;
&lt;div class="span4 offset4"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
<h2>Nesting columns</h2>
<p>To nest your content with the default grid, add a new <code>.row</code> and set of <code>.span*</code> columns within an existing <code>.span*</code> column. Nested rows should include a set of columns that add up to the number of columns of its parent.</p>
<div class="row show-grid">
<div class="span9">
<div class="span12">
Level 1 of column
<div class="row show-grid">
<div class="span6">
Level 2
</div>
<div class="span3">
<div class="span6">
Level 2
</div>
</div>
@@ -217,116 +220,12 @@
&lt;div class="span9"&gt;
Level 1 column
&lt;div class="row"&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;div class="span3"&gt;Level 2&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
</section>
<!-- Fluid grid system
================================================== -->
<section id="fluidGridSystem">
<div class="page-header">
<h1>Fluid grid system</h1>
</div>
<h2>Live fluid grid example</h2>
<p>The fluid grid system uses percents instead of pixels for column widths. It has the same responsive capabilities as our fixed grid system, ensuring proper proportions for key screen resolutions and devices.</p>
<div class="bs-docs-grid">
<div class="row-fluid show-grid">
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span8">8</div>
</div>
<div class="row-fluid show-grid">
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row-fluid show-grid">
<div class="span12">12</div>
</div>
</div>
<h3>Basic fluid grid HTML</h3>
<p>Make any row "fluid" by changing <code>.row</code> to <code>.row-fluid</code>. The column classes stay the exact same, making it easy to flip between fixed and fluid grids.</p>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span8"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
<h2>Fluid offsetting</h2>
<p>Operates the same way as the fixed grid system offsetting: add <code>.offset*</code> to any column to offset by that many columns.</p>
<div class="bs-docs-grid">
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span4 offset4">4 offset 4</div>
</div><!-- /row -->
<div class="row-fluid show-grid">
<div class="span3 offset3">3 offset 3</div>
<div class="span3 offset3">3 offset 3</div>
</div><!-- /row -->
<div class="row-fluid show-grid">
<div class="span6 offset6">6 offset 6</div>
</div><!-- /row -->
</div>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span4 offset2"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
<h2>Fluid nesting</h2>
<p>Nesting with fluid grids is a bit different: the number of nested columns should not match the parent's number of columns. Instead, each level of nested columns are reset because each row takes up 100% of the parent column.</p>
<div class="row-fluid show-grid">
<div class="span12">
Fluid 12
<div class="row-fluid show-grid">
<div class="span6">
Fluid 6
</div>
<div class="span6">
Fluid 6
</div>
</div>
</div>
</div>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span12"&gt;
Level 1 of column
&lt;div class="row-fluid"&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;div class="span6"&gt;Level 2&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
</section>

137
docs/templates/pages/scaffolding.mustache vendored
View File

@@ -16,7 +16,6 @@
<ul class="nav nav-list bs-docs-sidenav">
<li><a href="#global"><i class="icon-chevron-right"></i> {{_i}}Global styles{{/i}}</a></li>
<li><a href="#gridSystem"><i class="icon-chevron-right"></i> {{_i}}Grid system{{/i}}</a></li>
<li><a href="#fluidGridSystem"><i class="icon-chevron-right"></i> {{_i}}Fluid grid system{{/i}}</a></li>
<li><a href="#layouts"><i class="icon-chevron-right"></i> {{_i}}Layouts{{/i}}</a></li>
<li><a href="#responsive"><i class="icon-chevron-right"></i> {{_i}}Responsive design{{/i}}</a></li>
</ul>
@@ -79,18 +78,21 @@
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row show-grid">
<div class="span2">2</div>
<div class="span3">3</div>
<div class="span4">4</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row show-grid">
<div class="span4">4</div>
<div class="span5">5</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row show-grid">
<div class="span9">9</div>
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row show-grid">
<div class="span12">12</div>
</div>
</div>
@@ -109,33 +111,34 @@
<div class="bs-docs-grid">
<div class="row show-grid">
<div class="span4">4</div>
<div class="span3 offset2">3 offset 2</div>
<div class="span4 offset4">4 offset 4</div>
</div><!-- /row -->
<div class="row show-grid">
<div class="span3 offset1">3 offset 1</div>
<div class="span3 offset2">3 offset 2</div>
<div class="span3 offset3">3 offset 3</div>
<div class="span3 offset3">3 offset 3</div>
</div><!-- /row -->
<div class="row show-grid">
<div class="span6 offset3">6 offset 3</div>
<div class="span6 offset6">6 offset 6</div>
</div><!-- /row -->
</div>
<pre class="prettyprint linenums">
&lt;div class="row"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span3 offset2"&gt;...&lt;/div&gt;
&lt;div class="span4 offset4"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
<h2>{{_i}}Nesting columns{{/i}}</h2>
<p>{{_i}}To nest your content with the default grid, add a new <code>.row</code> and set of <code>.span*</code> columns within an existing <code>.span*</code> column. Nested rows should include a set of columns that add up to the number of columns of its parent.{{/i}}</p>
<div class="row show-grid">
<div class="span9">
<div class="span12">
{{_i}}Level 1 of column{{/i}}
<div class="row show-grid">
<div class="span6">
{{_i}}Level 2{{/i}}
</div>
<div class="span3">
<div class="span6">
{{_i}}Level 2{{/i}}
</div>
</div>
@@ -146,116 +149,12 @@
&lt;div class="span9"&gt;
{{_i}}Level 1 column{{/i}}
&lt;div class="row"&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;div class="span3"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
</section>
<!-- Fluid grid system
================================================== -->
<section id="fluidGridSystem">
<div class="page-header">
<h1>{{_i}}Fluid grid system{{/i}}</h1>
</div>
<h2>{{_i}}Live fluid grid example{{/i}}</h2>
<p>{{_i}}The fluid grid system uses percents instead of pixels for column widths. It has the same responsive capabilities as our fixed grid system, ensuring proper proportions for key screen resolutions and devices.{{/i}}</p>
<div class="bs-docs-grid">
<div class="row-fluid show-grid">
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
<div class="span1">1</div>
</div>
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span4">4</div>
<div class="span4">4</div>
</div>
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span8">8</div>
</div>
<div class="row-fluid show-grid">
<div class="span6">6</div>
<div class="span6">6</div>
</div>
<div class="row-fluid show-grid">
<div class="span12">12</div>
</div>
</div>
<h3>{{_i}}Basic fluid grid HTML{{/i}}</h3>
<p>{{_i}}Make any row "fluid" by changing <code>.row</code> to <code>.row-fluid</code>. The column classes stay the exact same, making it easy to flip between fixed and fluid grids.{{/i}}</p>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span8"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
<h2>{{_i}}Fluid offsetting{{/i}}</h2>
<p>{{_i}}Operates the same way as the fixed grid system offsetting: add <code>.offset*</code> to any column to offset by that many columns.{{/i}}</p>
<div class="bs-docs-grid">
<div class="row-fluid show-grid">
<div class="span4">4</div>
<div class="span4 offset4">4 offset 4</div>
</div><!-- /row -->
<div class="row-fluid show-grid">
<div class="span3 offset3">3 offset 3</div>
<div class="span3 offset3">3 offset 3</div>
</div><!-- /row -->
<div class="row-fluid show-grid">
<div class="span6 offset6">6 offset 6</div>
</div><!-- /row -->
</div>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span4"&gt;...&lt;/div&gt;
&lt;div class="span4 offset2"&gt;...&lt;/div&gt;
&lt;/div&gt;
</pre>
<h2>{{_i}}Fluid nesting{{/i}}</h2>
<p>{{_i}}Nesting with fluid grids is a bit different: the number of nested columns should not match the parent's number of columns. Instead, each level of nested columns are reset because each row takes up 100% of the parent column.{{/i}}</p>
<div class="row-fluid show-grid">
<div class="span12">
{{_i}}Fluid 12{{/i}}
<div class="row-fluid show-grid">
<div class="span6">
{{_i}}Fluid 6{{/i}}
</div>
<div class="span6">
{{_i}}Fluid 6{{/i}}
</div>
</div>
</div>
</div>
<pre class="prettyprint linenums">
&lt;div class="row-fluid"&gt;
&lt;div class="span12"&gt;
{{_i}}Level 1 of column{{/i}}
&lt;div class="row-fluid"&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;div class="span6"&gt;{{_i}}Level 2{{/i}}&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
</pre>
</section>