Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Added faux empty grid columns as plugins #91

Open
wants to merge 4 commits into from

2 participants

@yodasw16

I submitted this before, but never had a chance to make the requested changes. I have now moved the changes into the plugins directory instead of the main grids.css file.

original message:

I've seen this issue come up a few times in the google group, so I thought I'd take a stab at adding it to see if anyone else thinks it's a good idea.

Basically the concept is that sometimes you want to give the appearance of an empty column in a grid without having an empty element. This commit just adds classes that correspond with the current grid classes but adds append and prepend to them. For example, you could add the class "appendSize1of4" to create an empty 25% width space after a grid column, or "prependSize1of4" to add it before.

@ricklowes

I am wondering whether both sets (prepend and append) are both required? I was taking a look at Twitter Bootstrap today and noticed they only seem be using an 'offset' class (same as prepend) to achieve their examples and it looks like they would be able to cover what seems to be pretty much any layout. Are there use cases that you're aware of that would require both sets?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.
View
2  .gitignore
@@ -0,0 +1,2 @@
+/nbproject/private/
+nbproject
View
2  core/grid/grids.css
@@ -13,4 +13,4 @@
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}
-.lastUnit{float:none;display:block;display:table-cell;width:9999em;*width:auto;*zoom:1;_position:relative;_left:-3px;_margin-right:-3px;}
+.lastUnit{float:none;display:block;display:table-cell;width:9999em;*width:auto;*zoom:1;_position:relative;_left:-3px;_margin-right:-3px;}
View
9 plugins/gridsAppend/gridsAppend.css
@@ -0,0 +1,9 @@
+.appendSize1of2{padding-right:50%;}
+.appendSize1of3{padding-right:33.33333%;}
+.appendSize2of3{padding-right:66.66666%;}
+.appendSize1of4{padding-right:25%;}
+.appendSize3of4{padding-right:75%;}
+.appendSize1of5{padding-right:20%;}
+.appendSize2of5{padding-right:40%;}
+.appendSize3of5{padding-right:60%;}
+.appendSize4of5{padding-right:80%;}
View
9 plugins/gridsPrepend/gridsPrepend.css
@@ -0,0 +1,9 @@
+.prependSize1of2{padding-left:50%;}
+.prependSize1of3{padding-left:33.33333%;}
+.prependSize2of3{padding-left:66.66666%;}
+.prependSize1of4{padding-left:25%;}
+.prependSize3of4{padding-left:75%;}
+.prependSize1of5{padding-left:20%;}
+.prependSize2of5{padding-left:40%;}
+.prependSize3of5{padding-left:60%;}
+.prependSize4of5{padding-left:80%;}
Something went wrong with that request. Please try again.