diff --git a/doc-src/content/reference/compass/utilities/lists/inline-block-list.haml b/doc-src/content/reference/compass/utilities/lists/inline-block-list.haml
new file mode 100644
index 00000000..c315e30b
--- /dev/null
+++ b/doc-src/content/reference/compass/utilities/lists/inline-block-list.haml
@@ -0,0 +1,30 @@
+--- 
+title: Compass Inline-Block List
+crumb: Inline-Block List
+framework: compass
+stylesheet: compass/utilities/lists/_inline-block-list.scss
+layout: core
+meta_description: set list-elements to inline-block so they appear horizontally while retaining their structure.
+nav_stylesheet: compass/_utilities.scss
+classnames:
+  - reference
+  - core
+  - utilities
+---
+- render 'reference' do
+  :markdown
+    Easy mode using simple descendant li selectors:
+    
+        ul.nav
+          +inline-block-list
+    
+    Advanced mode:
+    If you need to target the list items using a different selector then use
+    +inline-block-list-container on your ul/ol and +inline-block-list-item on
+    your li. This may help when working on layouts involving nested lists. For 
+    example:
+    
+        ul.nav
+          +inline-block-list-container
+          > li
+            +inline-block-list-item