diff --git a/packages/web/src/scss/helpers/text/index.html b/packages/web/src/scss/helpers/text/index.html
index 807c5c9ae7..b5f4fc7d2c 100644
--- a/packages/web/src/scss/helpers/text/index.html
+++ b/packages/web/src/scss/helpers/text/index.html
@@ -1,20 +1,24 @@
 {{#> layout/plain }}
 
 <section class="docs-Section">
+  
+  <h2 class="docs-Heading">Truncate</h2>
+  
+  <div class="docs-Stack docs-Stack--start">
 
-  <h2 class="docs-Heading">Text</h2>
+    <div style="width: 400px">
+      <p class="text-truncate">
+        This is a truncated single-line text.
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit.
+      </p>
+      <p class="text-truncate-multiline">
+        This is a truncated multi-line text.
+        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia
+        perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis
+        provident unde. Eveniet, iste, molestiae?
+      </p>
+    </div>
 
-  <div style="width: 400px">
-    <p class="text-truncate">
-      This is a truncated single-line text.
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit.
-    </p>
-    <p class="text-truncate-multiline">
-      This is a truncated multi-line text.
-      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia
-      perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis
-      provident unde. Eveniet, iste, molestiae?
-    </p>
   </div>
 
 </section>