_widths.scss in tachyonscss-rails-4.9.0.1

- old
+ new

@@ -1,6 +1,5 @@
-
 // Converted Variables
 
 
 // Custom Media Query Variables
 
@@ -68,12 +67,12 @@
 .w-75 {  width:  75%; }
 .w-80 {  width:  80%; }
 .w-90 {  width:  90%; }
 .w-100 { width: 100%; }
 
-.w-third { width: (100% / 3); }
-.w-two-thirds { width: (100% / 1.5); }
+.w-third { width: calc(100% / 3); }
+.w-two-thirds { width: calc(100% / 1.5); }
 .w-auto { width: auto; }
 
 @media #{$breakpoint-not-small} {
   .w1-ns {  width: $width-1; }
   .w2-ns {  width: $width-2; }
@@ -92,12 +91,12 @@
   .w-70-ns { width:  70%; }
   .w-75-ns { width:  75%; }
   .w-80-ns { width:  80%; }
   .w-90-ns { width:  90%; }
   .w-100-ns { width: 100%; }
-  .w-third-ns { width: (100% / 3); }
-  .w-two-thirds-ns { width: (100% / 1.5); }
+  .w-third-ns { width: calc(100% / 3); }
+  .w-two-thirds-ns { width: calc(100% / 1.5); }
   .w-auto-ns { width: auto; }
 }
 
 @media #{$breakpoint-medium} {
   .w1-m {      width: $width-1; }
@@ -117,12 +116,12 @@
   .w-70-m { width:  70%; }
   .w-75-m { width:  75%; }
   .w-80-m { width:  80%; }
   .w-90-m { width:  90%; }
   .w-100-m { width: 100%; }
-  .w-third-m { width: (100% / 3); }
-  .w-two-thirds-m { width: (100% / 1.5); }
+  .w-third-m { width: calc(100% / 3); }
+  .w-two-thirds-m { width: calc(100% / 1.5); }
   .w-auto-m {    width: auto; }
 }
 
 @media #{$breakpoint-large} {
   .w1-l {      width: $width-1; }
@@ -142,9 +141,9 @@
   .w-70-l {    width:  70%; }
   .w-75-l {    width:  75%; }
   .w-80-l {    width:  80%; }
   .w-90-l {    width:  90%; }
   .w-100-l {   width: 100%; }
-  .w-third-l { width: (100% / 3); }
-  .w-two-thirds-l { width: (100% / 1.5); }
+  .w-third-l { width: calc(100% / 3); }
+  .w-two-thirds-l { width: calc(100% / 1.5); }
   .w-auto-l {    width: auto; }
 }