diff options
| -rw-r--r-- | _sass/_grid.scss | 42 | ||||
| -rw-r--r-- | css/main.scss | 3 |
2 files changed, 44 insertions, 1 deletions
diff --git a/_sass/_grid.scss b/_sass/_grid.scss new file mode 100644 index 0000000..da3e2d9 --- /dev/null +++ b/_sass/_grid.scss @@ -0,0 +1,42 @@ +// From http://www.responsivegridsystem.com/calculator/ + +/* SECTIONS */ +.section { + clear: both; + padding: 0px; + margin: 0px; +} + +/* COLUMN SETUP */ +.col { + display: block; + float:left; + margin: 1% 0 1% 1.6%; +} +.col:first-child { margin-left: 0; } + +/* GROUPING */ +.group:before, +.group:after { content:""; display:table; } +.group:after { clear:both;} +.group { zoom:1; /* For IE 6/7 */ } + +/* GRID OF TWO */ +.span_2_of_2 { + width: 100%; +} +.span_1_of_2 { + width: 49.2%; +} + +/* GO FULL WIDTH AT LESS THAN 480 PIXELS */ + +@media only screen and (max-width: 480px) { + .col { + margin: 1% 0 1% 0%; + } +} + +@media only screen and (max-width: 480px) { + .span_2_of_2, .span_1_of_2 { width: 100%; } +} diff --git a/css/main.scss b/css/main.scss index 737a708..1a624c7 100644 --- a/css/main.scss +++ b/css/main.scss @@ -146,5 +146,6 @@ $font-serif: 'Sintony', sans-serif; "as-theme", "special", "syntax-highlighting", - "contacts" + "contacts", + "grid" ; |