diff --git a/lib/nib/box.styl b/lib/nib/box.styl
deleted file mode 100644
index 73608532..00000000
--- a/lib/nib/box.styl
+++ /dev/null
@@ -1,28 +0,0 @@
-
-/*
- * Vendor "display: box" support.
- */
-
-display(type)
-  if box == type
-    display: vendor-value(type)
-  else
-    display: type
-
-/*
- * Synopsis:
- *
- *   box: <orient> [direction]
- *
- * Examples:
- *
- *     box: horizontal
- *     box: horizontal reverse
- *
- */
-
-box(args...)
-  display: box
-  box-orient: args[0]
-  if args[1]
-    box-direction: args[1]
diff --git a/lib/nib/flex.styl b/lib/nib/flex.styl
new file mode 100644
index 00000000..7cc51824
--- /dev/null
+++ b/lib/nib/flex.styl
@@ -0,0 +1,84 @@
+/*
+ * Vendor "display: flex" support with fallback to obsolete versions.
+ */
+
+display(type)
+  if flex == type || inline-flex == type
+    display: vendor-value(box, only: moz ms webkit)
+    display: vendor-value(type, only: webkit official) // overwrites old webkit
+  else
+    display: type
+
+/*
+ * New syntax for browsers like Google Chrome.
+ * Plus a translation to the old syntax, if possible.
+ */
+align-content()
+  vendor('align-content', arguments, only: webkit official)
+
+align-self()
+  vendor('align-self', arguments, only: webkit official)
+
+flex-basis()
+  vendor('flex-basics', arguments, only: webkit official)
+
+flex-shrink()
+  vendor('flex-shrink', arguments, only: webkit official)
+
+flex-wrap()
+  vendor('flex-wrap', arguments, only: webkit official)
+
+justify-content()
+  vendor('justify-content', arguments, only: webkit official)
+
+align-items(align)
+  /* obsolete */
+  if flex-start == align
+    align = start
+  else if flex-end == align
+    align = end
+  vendor('box-align', align, ignore: official)
+  
+  /* new */
+  vendor('align-items', arguments, only: webkit official)
+
+flex(growth)
+  /* obsolete */
+  vendor('flex', arguments, only: webkit official)
+  
+  /* new */
+  vendor('box-flex', growth)
+
+flex-direction(direction)
+  /* obsolete */
+  if row-reverse == direction || column-reverse == direction
+    vendor('box-direction', reverse, ignore: official)
+  if row == direction || row-reverse == direction
+    vendor('box-orient', horizontal, ignore: official)
+  else if column == direction || column-reverse == direction
+    vendor('box-orient', vertical, ignore: official)
+  
+  /* new */
+  vendor('flex-direction', arguments, only: webkit official)
+
+flex-flow(direction)
+  /* obsolete */
+  if row-reverse == direction || column-reverse == direction || wrap-reverse == direction
+    vendor('box-direction', 'reverse', ignore: official)
+  
+  /* new */
+  vendor('flex-flow', arguments, only: webkit official)
+
+flex-grow(growth)
+  /* obsolete */
+  vendor('flex-grow', arguments, only: webkit official)
+  
+  /* new */
+  vendor('box-flex', growth)
+
+order()
+  /* obsolete */
+  vendor('box-ordinal-group', arguments, ignore: official)
+  
+  /* new */
+  vendor('order', arguments, only: webkit official)
\ No newline at end of file