2 files changed, 25 insertions, 0 deletions
diff --git a/scss/_helpers.scss b/scss/_helpers.scss
index 8f566d12f..13fb1bbb5 100644
--- a/scss/_helpers.scss
+++ b/scss/_helpers.scss
@@ -2,6 +2,7 @@
 @import "helpers/colored-links";
 @import "helpers/ratio";
 @import "helpers/position";
+@import "helpers/stacks";
 @import "helpers/visually-hidden";
 @import "helpers/stretched-link";
 @import "helpers/text-truncation";
diff --git a/scss/helpers/_stacks.scss b/scss/helpers/_stacks.scss
new file mode 100644
index 000000000..bb0d4d55a
--- /dev/null
+++ b/scss/helpers/_stacks.scss
@@ -0,0 +1,24 @@
+// scss-docs-start stacks
+.hstack {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  align-self: stretch;
+}
+
+.vstack {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  align-self: stretch;
+}
+// scss-docs-end stacks
+
+.vr {
+  display: inline-block;
+  align-self: stretch;
+  width: 1px;
+  min-height: 1em;
+  background-color: currentColor;
+  opacity: $hr-opacity;
+}