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

more tests and experiments

Browse Source
This commit is contained in:
Mark Otto
2012-09-10 10:11:02 -07:00
parent dd1bce2611
commit 7110b243f5
4 changed files with 47 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
less/mixins.less
View File

@@ -609,11 +609,23 @@
.spanX (0) {}
.span(@columns) {
width: percentage(@columns / @gridColumns) - percentage(@gridGutterWidth / @gridRowWidth);
//width: percentage(@columns / @gridColumns) - percentage(@gridGutterWidth / @gridRowWidth) + percentage(@gridGutterWidth/(@columns - 1));
//width: (100% - ((@columns - 1) * (@gridGutterWidth / @gridRowWidth))) / @gridColumns;
//width: percentage((@columns * (((@columns - 1) * (@gridGutterWidth/@gridRowWidth)))) / @gridRowWidth);
width: percentage((@columns * (@gridRowWidth - ( @columns - 1 ) * (@gridGutterWidth/@gridRowWidth)) / 12 ) / @gridRowWidth);
//( 4 * (940 - (num_col - 1 )*(20/940)) )/940
margin-left: percentage((@gridGutterWidth / 2) / @gridRowWidth);
//margin-left: percentage((((@columns - 1) * @gridGutterWidth)/ @gridRowWidth ) / (2 * (@columns - 1) );
margin-right: percentage((@gridGutterWidth / 2) / @gridRowWidth);
//margin-right: percentage((((@columns - 1) * @gridGutterWidth)/ @gridRowWidth ) / (2 * (@columns - 1) );
}
// 940*4/12 - 20/940 = .312056737
// Space grid-sized controls properly if multiple per line
input[class*="span"]:first-child,
textarea[class*="span"]:first-child,

12
less/tests/grid.html
View File

@@ -17,7 +17,9 @@
padding-bottom: 30px;
}
.container {
background-color: rgba(255,0,0,.1);
}
</style>
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
@@ -75,7 +77,7 @@
<h2>Inputs</h2>
<input type="text" class="span1" placeholder=".span1">
<!-- <input type="text" class="span1" placeholder=".span1">
<input type="text" class="span2" placeholder=".span2">
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span5" placeholder=".span5">
@@ -93,6 +95,12 @@
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span5" placeholder=".span5">
</div>
-->
<div class="controls-row">
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span4" placeholder=".span4">
<input type="text" class="span4" placeholder=".span4">
</div>
</form> <!-- /container -->