From f0686448934538d41614f64c012bd9b1a07014eb Mon Sep 17 00:00:00 2001 From: Offshoot Studio Date: Thu, 23 Jun 2011 23:44:23 -0400 Subject: [PATCH] Fixed one-third and two-third rule declarations Was only working for one column type and not both the 12 and 16. Updated minified version with latest code. --- demo.html | 14 ++++++++++++++ stylesheets/skeleton.css | 8 ++++---- stylesheets/skeleton.min.css | 2 +- 3 files changed, 19 insertions(+), 5 deletions(-) diff --git a/demo.html b/demo.html index d94350b..6175fc2 100644 --- a/demo.html +++ b/demo.html @@ -75,6 +75,13 @@
Two
Eleven
One
+
One-Third
+
One-Third
+
One-Third
+
Two-Thirds
+
One-Third
+
One-Third
+
Two-Thirds

With Offsets

Eleven
@@ -125,6 +132,13 @@
Two
Fifteen
One
+
One-Third
+
One-Third
+
One-Third
+
Two-Thirds
+
One-Third
+
One-Thirds
+
Two-Thirds

With Offsets

Fifteen
diff --git a/stylesheets/skeleton.css b/stylesheets/skeleton.css index 86a7eea..1da9271 100644 --- a/stylesheets/skeleton.css +++ b/stylesheets/skeleton.css @@ -26,11 +26,11 @@ .row { margin-bottom: 20px; } /* Nested Column Classes */ - .column.alpha, .columns.alpha { margin-left: 0; } - .column.omega, .columns.omega { margin-right: 0; } + .column.alpha, .columns.alpha { margin-left: 0; } + .column.omega, .columns.omega { margin-right: 0; } - .container-twelve .one-third.column { width: 300px; } - .container-twelve .two-thirds.column { width: 620px; } + .container .one-third.column { width: 300px; } + .container .two-thirds.column { width: 620px; } /***************************** 12 Column diff --git a/stylesheets/skeleton.min.css b/stylesheets/skeleton.min.css index b28edb7..67c6eb7 100644 --- a/stylesheets/skeleton.min.css +++ b/stylesheets/skeleton.min.css @@ -1 +1 @@ -.container{position:relative;width:960px;margin:0 auto;padding:0}.column,.columns{float:left;display:inline;margin-left:10px;margin-right:10px}.row{margin-bottom:20px}.column.alpha,.columns.alpha{margin-left:0}.column.omega,.columns.omega{margin-right:0}.container-twelve .one-third.column{width:300px}.container-twelve .two-thirds.column{width:620px}.container-twelve .one.column{width:60px}.container-twelve .two.columns{width:140px}.container-twelve .three.columns{width:220px}.container-twelve .four.columns{width:300px}.container-twelve .five.columns{width:380px}.container-twelve .six.columns{width:460px}.container-twelve .seven.columns{width:540px}.container-twelve .eight.columns{width:620px}.container-twelve .nine.columns{width:700px}.container-twelve .ten.columns{width:780px}.container-twelve .eleven.columns{width:860px}.container-twelve .twelve.columns{width:940px}.container-twelve .offset-by-one{margin-left:80px}.container-twelve .offset-by-two{margin-left:160px}.container-twelve .offset-by-three{margin-left:240px}.container-twelve .offset-by-four{margin-left:320px}.container-twelve .offset-by-five{margin-left:400px}.container-twelve .offset-by-six{margin-left:480px}.container-twelve .offset-by-seven{margin-left:560px}.container-twelve .offset-by-eight{margin-left:640px}.container-twelve .offset-by-nine{margin-left:720px}.container-twelve .offset-by-ten{margin-left:800px}.container-twelve .offset-by-eleven{margin-left:880px}.container-sixteen .one.column{width:40px}.container-sixteen .two.columns{width:100px}.container-sixteen .three.columns{width:160px}.container-sixteen .four.columns{width:220px}.container-sixteen .five.columns{width:280px}.container-sixteen .six.columns{width:340px}.container-sixteen .seven.columns{width:400px}.container-sixteen .eight.columns{width:460px}.container-sixteen .nine.columns{width:520px}.container-sixteen .ten.columns{width:580px}.container-sixteen .eleven.columns{width:640px}.container-sixteen .twelve.columns{width:700px}.container-sixteen .thirteen.columns{width:760px}.container-sixteen .fourteen.columns{width:820px}.container-sixteen .fifteen.columns{width:880px}.container-sixteen .sixteen.columns{width:940px}.container-sixteen .offset-by-one{margin-left:60px}.container-sixteen .offset-by-two{margin-left:120px}.container-sixteen .offset-by-three{margin-left:180px}.container-sixteen .offset-by-four{margin-left:240px}.container-sixteen .offset-by-five{margin-left:300px}.container-sixteen .offset-by-six{margin-left:360px}.container-sixteen .offset-by-seven{margin-left:420px}.container-sixteen .offset-by-eight{margin-left:480px}.container-sixteen .offset-by-nine{margin-left:540px}.container-sixteen .offset-by-ten{margin-left:600px}.container-sixteen .offset-by-eleven{margin-left:660px}.container-sixteen .offset-by-twelve{margin-left:720px}.container-sixteen .offset-by-thirteen{margin-left:780px}.container-sixteen .offset-by-fourteen{margin-left:840px}.container-sixteen .offset-by-fifteen{margin-left:900px}@media only screen and (min-width:768px) and (max-width:959px){.container{width:768px}.column.alpha,.columns.alpha{margin-left:0;margin-right:10px}.column.omega,.columns.omega{margin-right:0;margin-left:10px}.container .one-third.column{width:236px}.container .two-thirds.column{width:492px}.container-twelve .one.column{width:44px}.container-twelve .two.columns{width:108px}.container-twelve .three.columns{width:172px}.container-twelve .four.columns{width:236px}.container-twelve .five.columns{width:300px}.container-twelve .six.columns{width:364px}.container-twelve .seven.columns{width:428px}.container-twelve .eight.columns{width:492px}.container-twelve .nine.columns{width:556px}.container-twelve .ten.columns{width:620px}.container-twelve .eleven.columns{width:684px}.container-twelve .twelve.columns{width:748px}.container-twelve .offset-by-one{margin-left:64px}.container-twelve .offset-by-two{margin-left:128px}.container-twelve .offset-by-three{margin-left:192px}.container-twelve .offset-by-four{margin-left:256px}.container-twelve .offset-by-five{margin-left:320px}.container-twelve .offset-by-six{margin-left:384px}.container-twelve .offset-by-seven{margin-left:448px}.container-twelve .offset-by-eight{margin-left:512px}.container-twelve .offset-by-nine{margin-left:576px}.container-twelve .offset-by-ten{margin-left:640px}.container-twelve .offset-by-eleven{margin-left:704px}.container-sixteen .one.column{width:28px}.container-sixteen .two.columns{width:76px}.container-sixteen .three.columns{width:124px}.container-sixteen .four.columns{width:172px}.container-sixteen .five.columns{width:220px}.container-sixteen .six.columns{width:268px}.container-sixteen .seven.columns{width:316px}.container-sixteen .eight.columns{width:364px}.container-sixteen .nine.columns{width:412px}.container-sixteen .ten.columns{width:460px}.container-sixteen .eleven.columns{width:508px}.container-sixteen .twelve.columns{width:556px}.container-sixteen .thirteen.columns{width:604px}.container-sixteen .fourteen.columns{width:652px}.container-sixteen .fifteen.columns{width:700px}.container-sixteen .sixteen.columns{width:748px}.container-sixteen .offset-by-one{margin-left:48px}.container-sixteen .offset-by-two{margin-left:96px}.container-sixteen .offset-by-three{margin-left:144px}.container-sixteen .offset-by-four{margin-left:192px}.container-sixteen .offset-by-five{margin-left:240px}.container-sixteen .offset-by-six{margin-left:286px}.container-sixteen .offset-by-seven{margin-left:336px}.container-sixteen .offset-by-eight{margin-left:384px}.container-sixteen .offset-by-nine{margin-left:432px}.container-sixteen .offset-by-ten{margin-left:480px}.container-sixteen .offset-by-eleven{margin-left:528px}.container-sixteen .offset-by-twelve{margin-left:576px}.container-sixteen .offset-by-thirteen{margin-left:624px}.container-sixteen .offset-by-fourteen{margin-left:672px}.container-sixteen .offset-by-fifteen{margin-left:720px}}@media only screen and (max-width:767px){.container{width:300px}.columns,.column{margin:0}.container .one.column,.container .two.columns,.container .three.columns,.container .four.columns,.container .five.columns,.container .six.columns,.container .seven.columns,.container .eight.columns,.container .nine.columns,.container .ten.columns,.container .eleven.columns,.container .twelve.columns,.container .thirteen.columns,.container .fourteen.columns,.container .fifteen.columns,.container .sixteen.columns,.container .one-third.column,.container .two-thirds.column{width:300px}.container .offset-by-one,.container .offset-by-two,.container .offset-by-three,.container .offset-by-four,.container .offset-by-five,.container .offset-by-six,.container .offset-by-seven,.container .offset-by-eight,.container .offset-by-nine,.container .offset-by-ten,.container .offset-by-eleven,.container .offset-by-twelve,.container .offset-by-thirteen,.container .offset-by-fourteen,.container .offset-by-fifteen{margin-left:0}}@media only screen and (min-width:480px) and (max-width:767px){.container{width:420px}.columns,.column{margin:0}.container .one.column,.container .two.columns,.container .three.columns,.container .four.columns,.container .five.columns,.container .six.columns,.container .seven.columns,.container .eight.columns,.container .nine.columns,.container .ten.columns,.container .eleven.columns,.container .twelve.columns,.container .thirteen.columns,.container .fourteen.columns,.container .fifteen.columns,.container .sixteen.columns,.container .one-third.column,.container .two-thirds.column{width:420px}}.container:after{content:"\0020";display:block;height:0;clear:both;visibility:hidden}.clearfix:before,.clearfix:after,.row:before,.row:after{content:'\0020';display:block;overflow:hidden;visibility:hidden;width:0;height:0}.row:after,.clearfix:after{clear:both}.row,.clearfix{zoom:1}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0} \ No newline at end of file +.container{position:relative;width:960px;margin:0 auto;padding:0}.column,.columns{float:left;display:inline;margin-left:10px;margin-right:10px}.row{margin-bottom:20px}.column.alpha,.columns.alpha{margin-left:0}.column.omega,.columns.omega{margin-right:0}.container .one-third.column{width:300px}.container .two-thirds.column{width:620px}.container-twelve .one.column{width:60px}.container-twelve .two.columns{width:140px}.container-twelve .three.columns{width:220px}.container-twelve .four.columns{width:300px}.container-twelve .five.columns{width:380px}.container-twelve .six.columns{width:460px}.container-twelve .seven.columns{width:540px}.container-twelve .eight.columns{width:620px}.container-twelve .nine.columns{width:700px}.container-twelve .ten.columns{width:780px}.container-twelve .eleven.columns{width:860px}.container-twelve .twelve.columns{width:940px}.container-twelve .offset-by-one{margin-left:80px}.container-twelve .offset-by-two{margin-left:160px}.container-twelve .offset-by-three{margin-left:240px}.container-twelve .offset-by-four{margin-left:320px}.container-twelve .offset-by-five{margin-left:400px}.container-twelve .offset-by-six{margin-left:480px}.container-twelve .offset-by-seven{margin-left:560px}.container-twelve .offset-by-eight{margin-left:640px}.container-twelve .offset-by-nine{margin-left:720px}.container-twelve .offset-by-ten{margin-left:800px}.container-twelve .offset-by-eleven{margin-left:880px}.container-sixteen .one.column{width:40px}.container-sixteen .two.columns{width:100px}.container-sixteen .three.columns{width:160px}.container-sixteen .four.columns{width:220px}.container-sixteen .five.columns{width:280px}.container-sixteen .six.columns{width:340px}.container-sixteen .seven.columns{width:400px}.container-sixteen .eight.columns{width:460px}.container-sixteen .nine.columns{width:520px}.container-sixteen .ten.columns{width:580px}.container-sixteen .eleven.columns{width:640px}.container-sixteen .twelve.columns{width:700px}.container-sixteen .thirteen.columns{width:760px}.container-sixteen .fourteen.columns{width:820px}.container-sixteen .fifteen.columns{width:880px}.container-sixteen .sixteen.columns{width:940px}.container-sixteen .offset-by-one{margin-left:60px}.container-sixteen .offset-by-two{margin-left:120px}.container-sixteen .offset-by-three{margin-left:180px}.container-sixteen .offset-by-four{margin-left:240px}.container-sixteen .offset-by-five{margin-left:300px}.container-sixteen .offset-by-six{margin-left:360px}.container-sixteen .offset-by-seven{margin-left:420px}.container-sixteen .offset-by-eight{margin-left:480px}.container-sixteen .offset-by-nine{margin-left:540px}.container-sixteen .offset-by-ten{margin-left:600px}.container-sixteen .offset-by-eleven{margin-left:660px}.container-sixteen .offset-by-twelve{margin-left:720px}.container-sixteen .offset-by-thirteen{margin-left:780px}.container-sixteen .offset-by-fourteen{margin-left:840px}.container-sixteen .offset-by-fifteen{margin-left:900px}@media only screen and (min-width:768px) and (max-width:959px){.container{width:768px}.column.alpha,.columns.alpha{margin-left:0;margin-right:10px}.column.omega,.columns.omega{margin-right:0;margin-left:10px}.container .one-third.column{width:236px}.container .two-thirds.column{width:492px}.container-twelve .one.column{width:44px}.container-twelve .two.columns{width:108px}.container-twelve .three.columns{width:172px}.container-twelve .four.columns{width:236px}.container-twelve .five.columns{width:300px}.container-twelve .six.columns{width:364px}.container-twelve .seven.columns{width:428px}.container-twelve .eight.columns{width:492px}.container-twelve .nine.columns{width:556px}.container-twelve .ten.columns{width:620px}.container-twelve .eleven.columns{width:684px}.container-twelve .twelve.columns{width:748px}.container-twelve .offset-by-one{margin-left:64px}.container-twelve .offset-by-two{margin-left:128px}.container-twelve .offset-by-three{margin-left:192px}.container-twelve .offset-by-four{margin-left:256px}.container-twelve .offset-by-five{margin-left:320px}.container-twelve .offset-by-six{margin-left:384px}.container-twelve .offset-by-seven{margin-left:448px}.container-twelve .offset-by-eight{margin-left:512px}.container-twelve .offset-by-nine{margin-left:576px}.container-twelve .offset-by-ten{margin-left:640px}.container-twelve .offset-by-eleven{margin-left:704px}.container-sixteen .one.column{width:28px}.container-sixteen .two.columns{width:76px}.container-sixteen .three.columns{width:124px}.container-sixteen .four.columns{width:172px}.container-sixteen .five.columns{width:220px}.container-sixteen .six.columns{width:268px}.container-sixteen .seven.columns{width:316px}.container-sixteen .eight.columns{width:364px}.container-sixteen .nine.columns{width:412px}.container-sixteen .ten.columns{width:460px}.container-sixteen .eleven.columns{width:508px}.container-sixteen .twelve.columns{width:556px}.container-sixteen .thirteen.columns{width:604px}.container-sixteen .fourteen.columns{width:652px}.container-sixteen .fifteen.columns{width:700px}.container-sixteen .sixteen.columns{width:748px}.container-sixteen .offset-by-one{margin-left:48px}.container-sixteen .offset-by-two{margin-left:96px}.container-sixteen .offset-by-three{margin-left:144px}.container-sixteen .offset-by-four{margin-left:192px}.container-sixteen .offset-by-five{margin-left:240px}.container-sixteen .offset-by-six{margin-left:286px}.container-sixteen .offset-by-seven{margin-left:336px}.container-sixteen .offset-by-eight{margin-left:384px}.container-sixteen .offset-by-nine{margin-left:432px}.container-sixteen .offset-by-ten{margin-left:480px}.container-sixteen .offset-by-eleven{margin-left:528px}.container-sixteen .offset-by-twelve{margin-left:576px}.container-sixteen .offset-by-thirteen{margin-left:624px}.container-sixteen .offset-by-fourteen{margin-left:672px}.container-sixteen .offset-by-fifteen{margin-left:720px}}@media only screen and (max-width:767px){.container{width:300px}.columns,.column{margin:0}.container .one.column,.container .two.columns,.container .three.columns,.container .four.columns,.container .five.columns,.container .six.columns,.container .seven.columns,.container .eight.columns,.container .nine.columns,.container .ten.columns,.container .eleven.columns,.container .twelve.columns,.container .thirteen.columns,.container .fourteen.columns,.container .fifteen.columns,.container .sixteen.columns,.container .one-third.column,.container .two-thirds.column{width:300px}.container .offset-by-one,.container .offset-by-two,.container .offset-by-three,.container .offset-by-four,.container .offset-by-five,.container .offset-by-six,.container .offset-by-seven,.container .offset-by-eight,.container .offset-by-nine,.container .offset-by-ten,.container .offset-by-eleven,.container .offset-by-twelve,.container .offset-by-thirteen,.container .offset-by-fourteen,.container .offset-by-fifteen{margin-left:0}}@media only screen and (min-width:480px) and (max-width:767px){.container{width:420px}.columns,.column{margin:0}.container .one.column,.container .two.columns,.container .three.columns,.container .four.columns,.container .five.columns,.container .six.columns,.container .seven.columns,.container .eight.columns,.container .nine.columns,.container .ten.columns,.container .eleven.columns,.container .twelve.columns,.container .thirteen.columns,.container .fourteen.columns,.container .fifteen.columns,.container .sixteen.columns,.container .one-third.column,.container .two-thirds.column{width:420px}}.container:after{content:"\0020";display:block;height:0;clear:both;visibility:hidden}.clearfix:before,.clearfix:after,.row:before,.row:after{content:'\0020';display:block;overflow:hidden;visibility:hidden;width:0;height:0}.row:after,.clearfix:after{clear:both}.row,.clearfix{zoom:1}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0} \ No newline at end of file