diff --git a/packages/components/alert/src/alert.ts b/packages/components/alert/src/alert.ts
index f179699e..abe388d4 100644
--- a/packages/components/alert/src/alert.ts
+++ b/packages/components/alert/src/alert.ts
@@ -37,6 +37,11 @@ export const alertProps = buildProps({
     required: false,
     default: undefined,
   },
+  buttonWrapLabel: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
   isClosable: {
     type: Boolean,
     required: false,
diff --git a/packages/components/alert/src/alert.vue b/packages/components/alert/src/alert.vue
index b557d50f..49c93bb4 100644
--- a/packages/components/alert/src/alert.vue
+++ b/packages/components/alert/src/alert.vue
@@ -32,6 +32,7 @@
       <PuikButton
         v-if="buttonLabel"
         :variant="variant"
+        :wrap-label="buttonWrapLabel"
         class="puik-alert__button"
         :data-test="dataTest != undefined ? `button-${dataTest}` : undefined"
         @click="click"
diff --git a/packages/components/alert/stories/alert.stories.ts b/packages/components/alert/stories/alert.stories.ts
index c405d565..5abf29c6 100644
--- a/packages/components/alert/stories/alert.stories.ts
+++ b/packages/components/alert/stories/alert.stories.ts
@@ -40,6 +40,14 @@ export default {
     buttonLabel: {
       description: 'Label of the button',
     },
+    buttonWrapLabel: {
+      description: 'Set the carriage return of the button label',
+      table: {
+        defaultValue: {
+          summary: false,
+        },
+      },
+    },
     isClosable: {
       description: 'Display a close button',
     },
@@ -59,6 +67,7 @@ export default {
     variant: 'success',
     disableBorders: false,
     buttonLabel: 'Button',
+    buttonWrapLabel: false,
     isClosable: false,
   },
 } as Meta
@@ -125,6 +134,110 @@ export const Default = {
   },
 }
 
+export const buttonWrapLabel: StoryObj = {
+  render: () => ({
+    components: {
+      PuikAlert,
+    },
+    template: `
+      <div class="flex flex-col space-y-4">
+       <puik-alert title="buttonWrapLabel to true" button-label="Button with a very long label" button-wrap-Label>
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+       </puik-alert>
+       <puik-alert title="buttonWrapLabel to false (by default)" button-label="Button with a very long label">
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+        This an alert with a very long description.
+       </puik-alert>
+      </div>
+    `,
+  }),
+
+  parameters: {
+    docs: {
+      source: {
+        code: `
+  <!--VueJS Snippet-->
+  <puik-alert
+    title="buttonWrapLabel to true"
+    button-label="Button with a very long label"
+    button-wrap-Label
+    @click="click"
+  >
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+  </puik-alert>
+
+  <puik-alert
+    title="buttonWrapLabel to false (by default)"
+    button-label="Button with a very long label"
+    @click="click"
+  >
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+    This an alert with a very long description.
+  </puik-alert>
+
+  <!--HTML/CSS Snippet-->
+<div class="puik-alert__container">
+  <div class="puik-alert__content">
+      <div class="puik-icon puik-alert__icon" style="font-size: 1.25rem;">check_circle</div>
+      <div class="puik-alert__text">
+          <p class="puik-alert__title">buttonWrapLabel to true</p>
+          <span class="puik-alert__description"> This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. </span>
+      </div>
+  </div>
+  <button class="puik-button puik-button--success puik-button--md puik-alert__button">
+      Button with a very long label
+  </button>
+</div>
+
+<div class="puik-alert__container">
+  <div class="puik-alert__content">
+      <div class="puik-icon puik-alert__icon" style="font-size: 1.25rem;">check_circle</div>
+      <div class="puik-alert__text">
+          <p class="puik-alert__title">buttonWrapLabel to false (by default)</p>
+          <span class="puik-alert__description"> This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. This an alert with a very long description. </span>
+      </div>
+  </div>
+  <button class="puik-button puik-button--success puik-button--md puik-button--no-wrap puik-alert__button">
+      Button with a very long label
+  </button>
+</div>
+        `,
+        language: 'html',
+      },
+    },
+  },
+}
+
 export const Success: StoryObj = {
   render: () => ({
     components: {
diff --git a/packages/components/alert/test/alert.spec.ts b/packages/components/alert/test/alert.spec.ts
index f670a7ea..baeaf11b 100644
--- a/packages/components/alert/test/alert.spec.ts
+++ b/packages/components/alert/test/alert.spec.ts
@@ -40,6 +40,11 @@ describe('Alert tests', () => {
     expect(findAlert().classes()).toContain('puik-alert--warning')
   })
 
+  it('should set the button label wrap to false', () => {
+    factory({ buttonLabel: 'Button', buttonWrapLabel: false })
+    expect(findButton().classes()).toContain('puik-button--no-wrap')
+  })
+
   it('should display a button which emits the click event on click', () => {
     factory({ buttonLabel: 'Button' })
     expect(findButton().exists()).toBeTruthy()
diff --git a/packages/components/button/src/button.ts b/packages/components/button/src/button.ts
index a6885676..f0158d3f 100644
--- a/packages/components/button/src/button.ts
+++ b/packages/components/button/src/button.ts
@@ -38,6 +38,11 @@ export const buttonProps = buildProps({
     required: false,
     default: false,
   },
+  wrapLabel: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
   disabled: {
     type: Boolean,
     required: false,
diff --git a/packages/components/button/src/button.vue b/packages/components/button/src/button.vue
index 5c095584..4f667329 100644
--- a/packages/components/button/src/button.vue
+++ b/packages/components/button/src/button.vue
@@ -8,6 +8,7 @@
       `puik-button--${size}`,
       { 'puik-button--disabled': disabled },
       { 'puik-button--fluid': fluid },
+      { 'puik-button--no-wrap': !wrapLabel },
     ]"
     :disabled="disabled"
     :data-test="dataTest"
diff --git a/packages/components/button/stories/button.stories.ts b/packages/components/button/stories/button.stories.ts
index a71e84a2..728cbcdb 100644
--- a/packages/components/button/stories/button.stories.ts
+++ b/packages/components/button/stories/button.stories.ts
@@ -44,6 +44,14 @@ export default {
         },
       },
     },
+    wrapLabel: {
+      description: 'Set the carriage return of the button label',
+      table: {
+        defaultValue: {
+          summary: false,
+        },
+      },
+    },
     disabled: {
       description: 'Set the button as disabled',
       table: {
@@ -81,6 +89,7 @@ export default {
     variant: 'primary',
     size: 'md',
     fluid: false,
+    wrapLabel: true,
     disabled: false,
     leftIcon: '',
     rightIcon: '',
@@ -117,6 +126,7 @@ export const Default = {
     :size="$sizes"
     :variant="$variants"
     :fluid="true|false"
+    :wrap-label="true|false"
     :disabled="true|false"
     :left-icon="leftIcon"
     :right-icon="rightIcon"
diff --git a/packages/components/button/test/button.spec.ts b/packages/components/button/test/button.spec.ts
index a209f85c..da319d3e 100644
--- a/packages/components/button/test/button.spec.ts
+++ b/packages/components/button/test/button.spec.ts
@@ -91,6 +91,11 @@ describe('Button tests', () => {
     expect(findButton().classes()).toContain('puik-button--fluid')
   })
 
+  it('should set the button label wrap to false', () => {
+    factory({ wrapLabel: false })
+    expect(findButton().classes()).toContain('puik-button--no-wrap')
+  })
+
   it('should be a router-link if to prop is defined', () => {
     factory({ to: '/test' })
     expect(findButton().element.tagName).toBe('ROUTER-LINK')
diff --git a/packages/tailwind-preset/theme.js b/packages/tailwind-preset/theme.js
index 2e0595af..61568df3 100644
--- a/packages/tailwind-preset/theme.js
+++ b/packages/tailwind-preset/theme.js
@@ -101,6 +101,11 @@ module.exports = {
     screens: {
       xs: '320px',
     },
+    minHeight: {
+      sm: '1.75rem',
+      md: '2.25rem',
+      lg: '3rem',
+    },
     opacity: {
       overlay: '0.8',
     },
diff --git a/packages/theme/src/alert.scss b/packages/theme/src/alert.scss
index 0f45dbee..2d865d51 100644
--- a/packages/theme/src/alert.scss
+++ b/packages/theme/src/alert.scss
@@ -1,7 +1,7 @@
 @use './common/typography.scss';
 
 .puik-alert {
-  @apply relative flex flex-row p-4 border text-primary-800 items-start;
+  @apply relative min-w-fit flex flex-row items-start p-4 border text-primary-800;
   &--success {
     @apply bg-green-50 border border-green;
     .puik-alert__icon {
@@ -30,7 +30,7 @@
     @apply border-0;
   }
   &__container {
-    @apply flex flex-col md:flex-row w-full;
+    @apply flex flex-col md:flex-row md:items-start w-full;
   }
   &__content {
     @apply flex flex-row flex-grow;
@@ -46,7 +46,7 @@
     @extend .puik-body-default;
   }
   &__button {
-    @apply text-sm whitespace-nowrap px-4 py-3 mt-2 ml-9 md:m-0;
+    @apply mt-2 ml-9 md:m-0;
   }
   &__icon {
     @apply mt-0.5 flex-shrink-0;
diff --git a/packages/theme/src/button.scss b/packages/theme/src/button.scss
index f9922b2d..f567b69d 100644
--- a/packages/theme/src/button.scss
+++ b/packages/theme/src/button.scss
@@ -6,22 +6,26 @@
 
   &--sm {
     @extend .puik-text-button-small;
-    @apply py-1 px-2 h-7;
+    @apply py-1 px-2 min-h-sm;
   }
 
   &--md {
-    @apply h-9;
+    @apply min-h-md;
   }
 
   &--lg {
     @extend .puik-text-button-large;
-    @apply py-3.5 px-4 gap-3 h-12;
+    @apply py-3.5 px-4 gap-3 min-h-lg;
   }
 
   &--fluid {
     @apply w-full;
   }
 
+  &--no-wrap {
+    @apply whitespace-nowrap;
+  }
+
   &:focus-visible {
     @apply outline-none ring ring-offset-2 ring-blue;
   }