IE10 uses display: -ms-flexbox, not display: -ms-flex

jayj · Oct 7, 2013 · 4e15423 · 4e15423
1 parent 85ca222
commit 4e15423
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git a/less/mixins.less b/less/mixins.less
@@ -354,13 +354,15 @@
 // CSS3 flexbox
 // http://css-tricks.com/old-flexbox-and-new-flexbox/
 // http://www.w3.org/TR/css3-flexbox
+// https://gist.github.com/jayj/4012969
 // --------------------------------------------------
 
 // flex or inline-flex
 .flex-display(@display: flex) {
 	display: ~"-webkit-@{display}";
 	display: ~"-moz-@{display}";
-	display: ~"-ms-@{display}";
+	display: ~"-ms-@{display}box"; // IE10 uses -ms-flexbox
+	display: ~"-ms-@{display}"; // IE11
 	display: @display;
 }
 

diff --git a/style.css b/style.css
@@ -491,6 +491,7 @@ caption {
 .flexbox .site-header .home-link {
   display: -webkit-flex;
   display: -moz-flex;
+  display: -ms-flexbox;
   display: -ms-flex;
   display: flex;
 }