More Complete Box-Sizing

Firefox is currently at version 29 according to http://caniuse.com/#search=box-sizing and still uses the -moz- prefix. It'd be nice to have a little support for that browser until a later time. It took me quiet some time figuring out why my grid rows didn't work. I'm not sure which mobile versions are supported by Foundation so I included the -webkit- prefix too.

diff --git a/scss/foundation/components/_global.scss b/scss/foundation/components/_global.scss
index 4fd24a45ff028df270e843cb0c7f0cfa161b124a..cc7d23d631364f54f87cd026881ba3cb3828502d 100644 (file)
--- a/scss/foundation/components/_global.scss
+++ b/scss/foundation/components/_global.scss
@@ -75,7 +75,9 @@ $base-line-height: 150% !default;
 //
 // We use this to add box-sizing across browser prefixes
 @mixin box-sizing($type:border-box) {
-  box-sizing: $type;
+  -webkit-box-sizing: $type; // Android < 2.3, iOS < 4
+          -moz-box-sizing: $type; // Firefox < 29
+               box-sizing: $type; // Chrome, IE 8+, Opera, Safari 5.1
 }
 
 // @mixins