diff --git a/addon/components/au-button.hbs b/addon/components/au-button.hbs
index 3a8177d52..e526aaf81 100644
--- a/addon/components/au-button.hbs
+++ b/addon/components/au-button.hbs
@@ -1,5 +1,5 @@
 <button
-  class="au-c-button {{this.width}} {{this.size}} {{this.skin}} {{this.alert}} {{this.loading}} {{this.disabled}} {{if (and @icon @hideText) 'au-c-button--icon-only'}}" disabled={{@disabled}}
+  class="au-c-button {{this.width}} {{this.size}} {{this.skin}} {{this.alert}} {{this.loading}} {{this.disabled}} {{if (and @icon @hideText) 'au-c-button--icon-only'}} {{if @wrap 'au-c-button--wrap'}}" disabled={{@disabled}}
   type="button"
   ...attributes
 >
diff --git a/app/styles/ember-appuniversum/_c-button.scss b/app/styles/ember-appuniversum/_c-button.scss
index 96454dc58..4b0535f8b 100644
--- a/app/styles/ember-appuniversum/_c-button.scss
+++ b/app/styles/ember-appuniversum/_c-button.scss
@@ -399,6 +399,13 @@ $au-button-icon-only-width-large                : $au-button-height-large  !defa
   }
 }
 
+// Wrap text inside a button
+.au-c-button--wrap {
+  height: auto;
+  white-space: initial;
+  text-align: left;
+}
+
 // Block button
 .au-c-button--block {
   display: flex;
diff --git a/stories/5-components/Buttons/AuButton.stories.js b/stories/5-components/Buttons/AuButton.stories.js
index 6c8fc7b2a..617eeae05 100644
--- a/stories/5-components/Buttons/AuButton.stories.js
+++ b/stories/5-components/Buttons/AuButton.stories.js
@@ -31,6 +31,10 @@ export default {
       options: ['', 'block'],
       description: 'Defines the width of a button',
     },
+    wrap: {
+      control: 'boolean',
+      description: 'Wrap the text inside a button',
+    },
     alert: {
       control: 'boolean',
       description: 'Adds an alert state to the button',
@@ -62,6 +66,7 @@ const Template = (args) => ({
       @iconAlignment={{this.iconAlignment}}
       @hideText={{this.hideText}}
       @width={{this.width}}
+      @wrap={{this.wrap}}
       @alert={{this.alert}}
       @disabled={{this.disabled}}
       @loading={{this.loading}}
@@ -81,6 +86,7 @@ Primary.args = {
   iconAlignment: 'left',
   hideText: false,
   width: '',
+  wrap: '',
   alert: false,
   disabled: false,
   loading: false,
@@ -95,6 +101,7 @@ Secondary.args = {
   iconAlignment: 'left',
   hideText: false,
   width: '',
+  wrap: '',
   alert: false,
   disabled: false,
   loading: false,
@@ -109,6 +116,7 @@ PrimaryLink.args = {
   iconAlignment: 'left',
   hideText: false,
   width: '',
+  wrap: '',
   alert: false,
   disabled: false,
   loading: false,
@@ -123,6 +131,7 @@ SecondaryLink.args = {
   iconAlignment: 'left',
   hideText: false,
   width: '',
+  wrap: '',
   alert: false,
   disabled: false,
   loading: false,