From 89d52f1821527cb5c5e6429ad413c133272f3aeb Mon Sep 17 00:00:00 2001 From: Stephanie Rewis Date: Sun, 1 Apr 2012 17:19:32 -0700 Subject: [PATCH] grids with box-sizing and gutters --- core/grid/grids_gutter.css | 14 ++++++++++ core/spacing/space_gutter.css | 50 +++++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+) create mode 100644 core/grid/grids_gutter.css create mode 100644 core/spacing/space_gutter.css diff --git a/core/grid/grids_gutter.css b/core/grid/grids_gutter.css new file mode 100644 index 00000000..f2e6029d --- /dev/null +++ b/core/grid/grids_gutter.css @@ -0,0 +1,14 @@ +.line,.lastUnit{overflow:hidden; *overflow:visible;*zoom:1;padding:0 10px;} +.unit{float:left;padding:0 10px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;} +.unitRight{float:right;} +.size1of1{float:none;} +.size1of2{width:50%;} +.size1of3{width:33.33333%;} +.size2of3{width:66.66666%;} +.size1of4{width:25%;} +.size3of4{width:75%;} +.size1of5{width:20%;} +.size2of5{width:40%;} +.size3of5{width:60%;} +.size4of5{width:80%;} +.lastUnit{float:none;width:auto;_position:relative;_left:-3px;_margin-right:-3px;} \ No newline at end of file diff --git a/core/spacing/space_gutter.css b/core/spacing/space_gutter.css new file mode 100644 index 00000000..a2ece532 --- /dev/null +++ b/core/spacing/space_gutter.css @@ -0,0 +1,50 @@ +/** + * Spacing classes + * Should be used to modify the default spacing between objects (not between nodes of the same object) + * Please use judiciously. You want to be using defaults most of the time, these are exceptions! + * + */ + /* ====== Default spacing ====== */ +h1, h2, h3, h4, h5, h6, ul, ol,dl, p,blockquote, .media {margin:10px 0;} +h1, h2, h3, h4, h5, h6,img{padding-bottom:0px;} +pre{margin: 10px 0;} +table h1,table h2,table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl{padding:0;} + +/* spacing helpers +p,m = padding,margin +a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical +s,m,l,n = small(5px),medium(10px),large(20px),none(0px) +*/ + +.ptn,.pvn,.pan{padding-top:0px !important} +.pts,.pvs,.pas{padding-top:5px !important} +.ptm,.pvm,.pam{padding-top:10px !important} +.ptl,.pvl,.pal{padding-top:20px !important} +.prn,.phn,.pan{padding-right:0px !important} +.prs,.phs,.pas{padding-right:5px !important} +.prm,.phm,.pam{padding-right:10px !important} +.prl,.phl,.pal{padding-right:20px !important} +.pbn,.pvn,.pan{padding-bottom:0px !important} +.pbs,.pvs,.pas{padding-bottom:5px !important} +.pbm,.pvm,.pam{padding-bottom:10px !important} +.pbl,.pvl,.pal{padding-bottom:20px !important} +.pln,.phn,.pan{padding-left:0px !important} +.pls,.phs,.pas{padding-left:5px !important} +.plm,.phm,.pam{padding-left:10px !important} +.pll,.phl,.pal{padding-left:20px !important} +.mtn,.mvn,.man{margin-top:0px !important} +.mts,.mvs,.mas{margin-top:5px !important} +.mtm,.mvm,.mam{margin-top:10px !important} +.mtl,.mvl,.mal{margin-top:20px !important} +.mrn,.mhn,.man{margin-right:0px !important} +.mrs,.mhs,.mas{margin-right:5px !important} +.mrm,.mhm,.mam{margin-right:10px !important} +.mrl,.mhl,.mal{margin-right:20px !important} +.mbn,.mvn,.man{margin-bottom:0px !important} +.mbs,.mvs,.mas{margin-bottom:5px !important} +.mbm,.mvm,.mam{margin-bottom:10px !important} +.mbl,.mvl,.mal{margin-bottom:20px !important} +.mln,.mhn,.man{margin-left:0px !important} +.mls,.mhs,.mas{margin-left:5px !important} +.mlm,.mhm,.mam{margin-left:10px !important} +.mll,.mhl,.mal{margin-left:20px !important}