From fb0fcf1f3011e51935854b7a69e2bdd58d3fb605 Mon Sep 17 00:00:00 2001
From: Jon Rohan <rohan@github.com>
Date: Mon, 5 Mar 2018 10:45:56 -0800
Subject: [PATCH] Adding height-fit utility class

---
 modules/primer-utilities/docs/layout.md  | 10 ++++++++++
 modules/primer-utilities/lib/layout.scss |  2 ++
 2 files changed, 12 insertions(+)

diff --git a/modules/primer-utilities/docs/layout.md b/modules/primer-utilities/docs/layout.md
index 521683ee64..fd4aa35617 100644
--- a/modules/primer-utilities/docs/layout.md
+++ b/modules/primer-utilities/docs/layout.md
@@ -156,6 +156,16 @@ Use `.width-full` to set width to 100%.
 </div>
 ```
 
+Use `.height-fit` to set max-height 100%.
+
+```html
+<div class="one-fourth column" style="height: 100px; overflow: auto;">
+  <div class="p-3 height-fit border">
+    Bacon ipsum dolor amet meatball flank beef tail pig boudin ham hock chicken capicola. Shoulder ham spare ribs turducken pork tongue. Bresaola corned beef sausage jowl ribeye kielbasa tenderloin andouille leberkas tongue. Ribeye tri-tip tenderloin pig, chuck ground round chicken tongue corned beef biltong.
+  </div>
+</div>
+```
+
 Use `.height-full` to set height to 100%.
 
 ```html
diff --git a/modules/primer-utilities/lib/layout.scss b/modules/primer-utilities/lib/layout.scss
index ae2eda6dda..9b88241f7c 100644
--- a/modules/primer-utilities/lib/layout.scss
+++ b/modules/primer-utilities/lib/layout.scss
@@ -76,6 +76,8 @@
 .width-fit   { max-width: 100% !important; }
 /* Set the width to 100% */
 .width-full  { width: 100% !important; }
+/* Max height 100% */
+.height-fit  { max-height: 100% !important; }
 /* Set the height to 100% */
 .height-full { height: 100% !important; }