diff --git a/packages/core/docs/vibe-3-changelog.md b/packages/core/docs/vibe-3-changelog.md
index 7e2bf6cc49..5b5b5b1ae5 100644
--- a/packages/core/docs/vibe-3-changelog.md
+++ b/packages/core/docs/vibe-3-changelog.md
@@ -245,6 +245,8 @@ codemod: `search-component-import-migration`
 - `position` changed to only accept "top, right, bottom, left"
 - `justify` removed
 - `arrowPosition` removed
+- `withMaxWidth` prop removed, max-width is now set to 240px [codemod]
+- Tooltip's content is now wrapped in another div, non-block layouts inside the tooltip may break
 
 ### ColorPicker
 
diff --git a/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-non-ranged.test.js.snap b/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-non-ranged.test.js.snap
index 33d84429d0..32f0ec447b 100644
--- a/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-non-ranged.test.js.snap
+++ b/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-non-ranged.test.js.snap
@@ -59,7 +59,11 @@ Snapshot Diff:
 +           <div
 +             class="tooltip dark"
 +           >
-+             20%
++             <div
++               class="content"
++             >
++               20%
++             </div>
 +           </div>
 +           <div
 +             class="arrow arrow dark"
@@ -94,7 +98,11 @@ Snapshot Diff:
 -           <div
 -             class="tooltip dark"
 -           >
--             20%
+-             <div
+-               class="content"
+-             >
+-               20%
+-             </div>
 -           </div>
 -           <div
 -             class="arrow arrow dark"
@@ -129,7 +137,11 @@ Snapshot Diff:
 +           <div
 +             class="tooltip dark"
 +           >
-+             20%
++             <div
++               class="content"
++             >
++               20%
++             </div>
 +           </div>
 +           <div
 +             class="arrow arrow dark"
@@ -164,7 +176,11 @@ Snapshot Diff:
 -           <div
 -             class="tooltip dark"
 -           >
--             20%
+-             <div
+-               class="content"
+-             >
+-               20%
+-             </div>
 -           </div>
 -           <div
 -             class="arrow arrow dark"
diff --git a/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-ranged.test.js.snap b/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-ranged.test.js.snap
index 1e0218836f..e5c097a42f 100644
--- a/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-ranged.test.js.snap
+++ b/packages/core/src/components/Slider/__tests__/__snapshots__/Slider-ranged.test.js.snap
@@ -70,7 +70,11 @@ Snapshot Diff:
 +           <div
 +             class="tooltip dark"
 +           >
-+             25%
++             <div
++               class="content"
++             >
++               25%
++             </div>
 +           </div>
 +           <div
 +             class="arrow arrow dark"
@@ -105,7 +109,11 @@ Snapshot Diff:
 +           <div
 +             class="tooltip dark"
 +           >
-+             65%
++             <div
++               class="content"
++             >
++               65%
++             </div>
 +           </div>
 +           <div
 +             class="arrow arrow dark"
@@ -140,7 +148,11 @@ Snapshot Diff:
 -           <div
 -             class="tooltip dark"
 -           >
--             25%
+-             <div
+-               class="content"
+-             >
+-               25%
+-             </div>
 -           </div>
 -           <div
 -             class="arrow arrow dark"
@@ -175,7 +187,11 @@ Snapshot Diff:
 +           <div
 +             class="tooltip dark"
 +           >
-+             25%
++             <div
++               class="content"
++             >
++               25%
++             </div>
 +           </div>
 +           <div
 +             class="arrow arrow dark"
@@ -219,14 +235,14 @@ Snapshot Diff:
         />
         <span
 @@ --- --- @@
-            <div
-              class="tooltip dark"
-            >
--             25%
-+             65%
+              <div
+                class="content"
+              >
+-               25%
++               65%
+              </div>
             </div>
             <div
-              class="arrow arrow dark"
 @@ --- --- @@
             />
           </div>
@@ -285,7 +301,11 @@ Snapshot Diff:
 -           <div
 -             class="tooltip dark"
 -           >
--             65%
+-             <div
+-               class="content"
+-             >
+-               65%
+-             </div>
 -           </div>
 -           <div
 -             class="arrow arrow dark"
diff --git a/packages/core/src/components/Tipseen/Tipseen.module.scss b/packages/core/src/components/Tipseen/Tipseen.module.scss
index 2e7f195692..81c5617aa6 100644
--- a/packages/core/src/components/Tipseen/Tipseen.module.scss
+++ b/packages/core/src/components/Tipseen/Tipseen.module.scss
@@ -5,6 +5,7 @@
   min-height: 40px;
   --tooltip-padding: 0;
   --tooltip-border-radius: var(--border-radius-medium);
+  --tooltip-max-width: initial;
 
   &WithoutCustomWidth {
     --tooltip-max-width: 320px;
diff --git a/packages/core/src/components/Tipseen/__tests__/__snapshots__/Tipseen.test.tsx.snap b/packages/core/src/components/Tipseen/__tests__/__snapshots__/Tipseen.test.tsx.snap
index 0fd7f93d5c..85390334d5 100644
--- a/packages/core/src/components/Tipseen/__tests__/__snapshots__/Tipseen.test.tsx.snap
+++ b/packages/core/src/components/Tipseen/__tests__/__snapshots__/Tipseen.test.tsx.snap
@@ -91,6 +91,76 @@ exports[`Snapshot tests Tipseen tests renders correctly with dark close button t
     >
       <div
         class="tooltip dark tipseenWrapper tipseenWrapperWithoutCustomWidth"
+      >
+        <div
+          class="content"
+        >
+          <div>
+            <div
+              class="tipseenHeader"
+            >
+              <button
+                aria-busy="false"
+                aria-disabled="false"
+                aria-label="Close"
+                class="tipseenCloseButton dark button sizeMedium kindTertiary colorDark noSidePadding"
+                data-testid="icon-button"
+                style="justify-content: center; align-items: center; padding: 0px; width: 24px; height: 24px;"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="icon noFocusStyle"
+                  data-testid="icon"
+                  fill="currentColor"
+                  height="16"
+                  viewBox="0 0 20 20"
+                  width="16"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L8.62562 9.68628L5.47045 12.8415C5.17756 13.1343 5.17756 13.6092 5.47045 13.9021C5.76334 14.195 6.23822 14.195 6.53111 13.9021L9.68628 10.7469L12.8415 13.9021C13.1343 14.195 13.6092 14.195 13.9021 13.9021C14.195 13.6092 14.195 13.1343 13.9021 12.8415L10.7469 9.68628L13.9029 6.53033C14.1958 6.23744 14.1958 5.76256 13.9029 5.46967C13.61 5.17678 13.1351 5.17678 12.8422 5.46967L9.68628 8.62562L6.53033 5.46967Z"
+                    fill="currentColor"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
+            </div>
+            <p
+              class="typography onInverted start text text2Normal tipseenContent"
+              data-testid="text"
+              style="--text-clamp-lines: 1;"
+            >
+              content
+            </p>
+          </div>
+        </div>
+      </div>
+      <div
+        class="arrow arrow dark"
+        data-placement="bottom"
+        style="position: absolute; left: 0px; transform: translate(0px, 0px) rotate(45deg);"
+      />
+    </div>
+  </span>
+</DocumentFragment>
+`;
+
+exports[`Snapshot tests Tipseen tests renders correctly with floating variation 1`] = `
+<span
+  class="monday-style-dialog-content-wrapper contentWrapper"
+  data-popper-reference-hidden="false"
+  data-testid="tooltip"
+  style="position: absolute; left: 0px; top: 0px;"
+>
+  <div
+    class="contentComponent bottom"
+  >
+    <div
+      class="tooltip dark tipseenWrapper tipseenWrapperWithoutCustomWidth floating"
+    >
+      <div
+        class="content"
       >
         <div>
           <div
@@ -100,7 +170,7 @@ exports[`Snapshot tests Tipseen tests renders correctly with dark close button t
               aria-busy="false"
               aria-disabled="false"
               aria-label="Close"
-              class="tipseenCloseButton dark button sizeMedium kindTertiary colorDark noSidePadding"
+              class="tipseenCloseButton button sizeMedium kindTertiary colorOnInvertedBackground noSidePadding"
               data-testid="icon-button"
               style="justify-content: center; align-items: center; padding: 0px; width: 24px; height: 24px;"
               type="button"
@@ -132,68 +202,6 @@ exports[`Snapshot tests Tipseen tests renders correctly with dark close button t
           </p>
         </div>
       </div>
-      <div
-        class="arrow arrow dark"
-        data-placement="bottom"
-        style="position: absolute; left: 0px; transform: translate(0px, 0px) rotate(45deg);"
-      />
-    </div>
-  </span>
-</DocumentFragment>
-`;
-
-exports[`Snapshot tests Tipseen tests renders correctly with floating variation 1`] = `
-<span
-  class="monday-style-dialog-content-wrapper contentWrapper"
-  data-popper-reference-hidden="false"
-  data-testid="tooltip"
-  style="position: absolute; left: 0px; top: 0px;"
->
-  <div
-    class="contentComponent bottom"
-  >
-    <div
-      class="tooltip dark tipseenWrapper tipseenWrapperWithoutCustomWidth floating"
-    >
-      <div>
-        <div
-          class="tipseenHeader"
-        >
-          <button
-            aria-busy="false"
-            aria-disabled="false"
-            aria-label="Close"
-            class="tipseenCloseButton button sizeMedium kindTertiary colorOnInvertedBackground noSidePadding"
-            data-testid="icon-button"
-            style="justify-content: center; align-items: center; padding: 0px; width: 24px; height: 24px;"
-            type="button"
-          >
-            <svg
-              aria-hidden="true"
-              class="icon noFocusStyle"
-              data-testid="icon"
-              fill="currentColor"
-              height="16"
-              viewBox="0 0 20 20"
-              width="16"
-            >
-              <path
-                clip-rule="evenodd"
-                d="M6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L8.62562 9.68628L5.47045 12.8415C5.17756 13.1343 5.17756 13.6092 5.47045 13.9021C5.76334 14.195 6.23822 14.195 6.53111 13.9021L9.68628 10.7469L12.8415 13.9021C13.1343 14.195 13.6092 14.195 13.9021 13.9021C14.195 13.6092 14.195 13.1343 13.9021 12.8415L10.7469 9.68628L13.9029 6.53033C14.1958 6.23744 14.1958 5.76256 13.9029 5.46967C13.61 5.17678 13.1351 5.17678 12.8422 5.46967L9.68628 8.62562L6.53033 5.46967Z"
-                fill="currentColor"
-                fill-rule="evenodd"
-              />
-            </svg>
-          </button>
-        </div>
-        <p
-          class="typography onInverted start text text2Normal tipseenContent"
-          data-testid="text"
-          style="--text-clamp-lines: 1;"
-        >
-          content
-        </p>
-      </div>
     </div>
   </div>
 </span>
@@ -216,17 +224,21 @@ exports[`Snapshot tests Tipseen tests renders correctly without close 1`] = `
       <div
         class="tooltip dark tipseenWrapper tipseenWrapperWithoutCustomWidth"
       >
-        <div>
-          <div
-            class="tipseenHeader"
-          />
-          <p
-            class="typography onInverted start text text2Normal tipseenContent"
-            data-testid="text"
-            style="--text-clamp-lines: 1;"
-          >
-            content
-          </p>
+        <div
+          class="content"
+        >
+          <div>
+            <div
+              class="tipseenHeader"
+            />
+            <p
+              class="typography onInverted start text text2Normal tipseenContent"
+              data-testid="text"
+              style="--text-clamp-lines: 1;"
+            >
+              content
+            </p>
+          </div>
         </div>
       </div>
       <div
diff --git a/packages/core/src/components/Tooltip/Tooltip.module.scss b/packages/core/src/components/Tooltip/Tooltip.module.scss
index a17180f302..1ca704b42c 100644
--- a/packages/core/src/components/Tooltip/Tooltip.module.scss
+++ b/packages/core/src/components/Tooltip/Tooltip.module.scss
@@ -6,21 +6,13 @@ $tooltip-z-index: 9999999999999999;
   position: relative;
   display: inline-block;
   border-radius: var(--tooltip-border-radius, var(--border-radius-small));
-  padding: var(--tooltip-padding, #{var(--spacing-small) var(--spacing-medium)});
   box-shadow: var(--box-shadow-medium);
   @include font-input();
   max-width: var(--tooltip-max-width, 50vw);
   word-break: break-word;
   background-color: var(--inverted-color-background);
   color: var(--text-color-on-inverted);
-
-  &.tooltipWithContent {
-    padding: unset;
-  }
-
-  &.withMaxWidth {
-    --tooltip-max-width: 240px;
-  }
+  --tooltip-max-width: 240px;
 
   .image {
     display: block;
diff --git a/packages/core/src/components/Tooltip/Tooltip.tsx b/packages/core/src/components/Tooltip/Tooltip.tsx
index 6c9afb1999..06a537994d 100644
--- a/packages/core/src/components/Tooltip/Tooltip.tsx
+++ b/packages/core/src/components/Tooltip/Tooltip.tsx
@@ -117,11 +117,6 @@ interface TooltipBaseProps extends VibeComponentProps {
    * Overwrites z-index of the tooltip
    */
   zIndex?: number;
-  // TODO: make default next major
-  /**
-   * Limit tooltip to 240px
-   */
-  withMaxWidth?: boolean;
   /**
    * The title of the tooltip
    */
@@ -197,7 +192,7 @@ export default class Tooltip extends PureComponent<TooltipProps> {
   }
 
   renderTooltipContent() {
-    const { theme, content, className, style, withMaxWidth, title, image, icon } = this.props;
+    const { theme, content, className, style, title, image, icon } = this.props;
     if (!content) {
       // don't render empty tooltip
       return null;
@@ -215,44 +210,18 @@ export default class Tooltip extends PureComponent<TooltipProps> {
       return null;
     }
 
-    if (title || image) {
-      return (
-        <div
-          style={style}
-          className={cx(
-            styles.tooltip,
-            styles.tooltipWithContent,
-            getStyle(styles, camelCase(theme)),
-            { [styles.withMaxWidth]: withMaxWidth },
-            className
+    return (
+      <div style={style} className={cx(styles.tooltip, getStyle(styles, camelCase(theme)), className)}>
+        {image && <img className={styles.image} src={image} alt="" />}
+        <div className={cx(styles.content)}>
+          {title && (
+            <Flex gap="xs">
+              {icon && <Icon iconSize="20" icon={icon} clickable={false} />}
+              <div className={styles.title}>{title}</div>
+            </Flex>
           )}
-        >
-          {image && <img className={styles.image} src={image} alt="" />}
-          <div className={cx(styles.content)}>
-            {title && (
-              <Flex gap="xs">
-                {icon && <Icon iconSize="20" icon={icon} clickable={false} />}
-                <div className={styles.title}>{title}</div>
-              </Flex>
-            )}
-            {contentValue}
-          </div>
+          {contentValue}
         </div>
-      );
-    }
-
-    // TODO: remove in next major, use (title || image) variant instead
-    return (
-      <div
-        style={style}
-        className={cx(
-          styles.tooltip,
-          getStyle(styles, camelCase(theme)),
-          { [styles.withMaxWidth]: withMaxWidth },
-          className
-        )}
-      >
-        {contentValue}
       </div>
     );
   }
diff --git a/packages/core/src/components/Tooltip/__stories__/Tooltip.mdx b/packages/core/src/components/Tooltip/__stories__/Tooltip.mdx
index 27b6b53230..cc6e010a80 100644
--- a/packages/core/src/components/Tooltip/__stories__/Tooltip.mdx
+++ b/packages/core/src/components/Tooltip/__stories__/Tooltip.mdx
@@ -118,7 +118,6 @@ Tooltip's arrow can appear from top, bottom, left or right.
         component: (
           <Tooltip
             shouldShowOnMount
-            withMaxWidth
             title="I'm a rich tooltip"
             modifiers={modifiers}
             open
@@ -138,7 +137,6 @@ Tooltip's arrow can appear from top, bottom, left or right.
         component: (
           <Tooltip
             shouldShowOnMount
-            withMaxWidth
             title="I'm a rich tooltip"
             modifiers={modifiers}
             open
@@ -159,7 +157,6 @@ Tooltip's arrow can appear from top, bottom, left or right.
         component: (
           <Tooltip
             content="Empower users to visualize data."
-            withMaxWidth
             shouldShowOnMount
             image={image}
             position="right"
@@ -175,7 +172,6 @@ Tooltip's arrow can appear from top, bottom, left or right.
         component: (
           <Tooltip
             content="View our automation center."
-            withMaxWidth
             shouldShowOnMount
             image={image}
             position="right"
diff --git a/packages/core/src/components/Tooltip/__stories__/Tooltip.stories.tsx b/packages/core/src/components/Tooltip/__stories__/Tooltip.stories.tsx
index bbd0cad948..036d6a8dc6 100644
--- a/packages/core/src/components/Tooltip/__stories__/Tooltip.stories.tsx
+++ b/packages/core/src/components/Tooltip/__stories__/Tooltip.stories.tsx
@@ -28,7 +28,6 @@ const tooltipTemplate = (args: TooltipProps) => {
         // The modifier's purpose is to prevent the tipseen from being displayed when the user scrolls the story upwards / downwards.
         // Therefore, there is no need to move this prop in your implementations.
         modifiers={modifiers}
-        withMaxWidth
         {...args}
         open
       >
@@ -57,7 +56,6 @@ export const TooltipWithTitle = () => (
     <Tooltip
       content="Hidden columns"
       title="Tooltip title"
-      withMaxWidth
       shouldShowOnMount
       position="right"
       modifiers={modifiers}
@@ -73,7 +71,6 @@ export const TooltipWithImage = () => (
     <Tooltip
       content="Max width tooltip with a long text example"
       title="Tooltip title"
-      withMaxWidth
       shouldShowOnMount
       image={image}
       position="right"
@@ -93,22 +90,22 @@ export const Positions = {
         <div>
           {/* The modifier's purpose is to prevent the tipseen from being displayed when the user scrolls the story upwards / downwards.
          Therefore, there is no need to move this prop in your implementations. */}
-          <Tooltip modifiers={modifiers} content="Top" shouldShowOnMount position="bottom" withMaxWidth open>
+          <Tooltip modifiers={modifiers} content="Top" shouldShowOnMount position="bottom" open>
             <div />
           </Tooltip>
         </div>
         <div>
-          <Tooltip modifiers={modifiers} content="Bottom" shouldShowOnMount withMaxWidth open>
+          <Tooltip modifiers={modifiers} content="Bottom" shouldShowOnMount open>
             <div />
           </Tooltip>
         </div>
         <div>
-          <Tooltip modifiers={modifiers} content="Left" position="right" shouldShowOnMount withMaxWidth open>
+          <Tooltip modifiers={modifiers} content="Left" position="right" shouldShowOnMount open>
             <div />
           </Tooltip>
         </div>
         <div>
-          <Tooltip modifiers={modifiers} content="Right" position="left" shouldShowOnMount withMaxWidth open>
+          <Tooltip modifiers={modifiers} content="Right" position="left" shouldShowOnMount open>
             <div />
           </Tooltip>
         </div>
@@ -124,13 +121,13 @@ export const Positions = {
 };
 
 export const IconTooltip = () => (
-  <Tooltip content="Hidden columns" withMaxWidth>
+  <Tooltip content="Hidden columns">
     <IconButton kind="secondary" size="small" icon={Hide} />
   </Tooltip>
 );
 
 export const DefinitionTooltip = () => (
-  <Tooltip content="Item name: Bottom sheets" withMaxWidth>
+  <Tooltip content="Item name: Bottom sheets">
     <Button kind="secondary" size="small" leftIcon={Subitems}>
       Subitem
     </Button>
@@ -139,13 +136,13 @@ export const DefinitionTooltip = () => (
 
 export const ImmediateTooltips = () => (
   <Flex gap="small">
-    <Tooltip immediateShowDelay={0} content="I'm a tooltip" withMaxWidth>
+    <Tooltip immediateShowDelay={0} content="I'm a tooltip">
       <IconButton icon={Menu} kind="secondary" size="small" />
     </Tooltip>
-    <Tooltip immediateShowDelay={0} content="I'm a tooltip" withMaxWidth>
+    <Tooltip immediateShowDelay={0} content="I'm a tooltip">
       <IconButton icon={Menu} kind="secondary" size="small" />
     </Tooltip>
-    <Tooltip content="I'm a tooltip" withMaxWidth>
+    <Tooltip content="I'm a tooltip">
       <IconButton icon={Menu} kind="secondary" size="small" />
     </Tooltip>
   </Flex>
diff --git a/packages/core/src/components/Tooltip/__tests__/__snapshots__/Tooltip.snapshot.test.tsx.snap b/packages/core/src/components/Tooltip/__tests__/__snapshots__/Tooltip.snapshot.test.tsx.snap
index ab54ef1def..325b10392a 100644
--- a/packages/core/src/components/Tooltip/__tests__/__snapshots__/Tooltip.snapshot.test.tsx.snap
+++ b/packages/core/src/components/Tooltip/__tests__/__snapshots__/Tooltip.snapshot.test.tsx.snap
@@ -34,7 +34,11 @@ exports[`Tooltip renders correctly with data-testid 1`] = `
         onMouseEnter={[Function]}
         onMouseLeave={[Function]}
       >
-        test
+        <div
+          className="content"
+        >
+          test
+        </div>
       </div>
       <div
         className="arrow arrow dark"
@@ -86,7 +90,11 @@ exports[`Tooltip renders correctly with hideWhenReferenceHidden 1`] = `
         onMouseEnter={[Function]}
         onMouseLeave={[Function]}
       >
-        test
+        <div
+          className="content"
+        >
+          test
+        </div>
       </div>
       <div
         className="arrow arrow dark"
@@ -138,7 +146,11 @@ exports[`Tooltip renders correctly with position 1`] = `
         onMouseEnter={[Function]}
         onMouseLeave={[Function]}
       >
-        test
+        <div
+          className="content"
+        >
+          test
+        </div>
       </div>
       <div
         className="arrow arrow dark"
@@ -195,7 +207,11 @@ exports[`Tooltip renders correctly with style 1`] = `
           }
         }
       >
-        test
+        <div
+          className="content"
+        >
+          test
+        </div>
       </div>
       <div
         className="arrow arrow dark"
@@ -247,7 +263,11 @@ exports[`Tooltip renders correctly with theme 1`] = `
         onMouseEnter={[Function]}
         onMouseLeave={[Function]}
       >
-        test
+        <div
+          className="content"
+        >
+          test
+        </div>
       </div>
       <div
         className="arrow arrow primary"
@@ -269,7 +289,11 @@ exports[`Tooltip renders correctly with withoutDialog 1`] = `
 <div
   className="tooltip dark"
 >
-  test
+  <div
+    className="content"
+  >
+    test
+  </div>
 </div>
 `;
 
@@ -307,7 +331,11 @@ exports[`Tooltip renders correctly without arrow 1`] = `
         onMouseEnter={[Function]}
         onMouseLeave={[Function]}
       >
-        test
+        <div
+          className="content"
+        >
+          test
+        </div>
       </div>
     </div>
   </span>,
diff --git a/packages/core/src/storybook/components/related-components/descriptions/tab-description.jsx b/packages/core/src/storybook/components/related-components/descriptions/tab-description.jsx
index 69261bad26..eb261b6b81 100644
--- a/packages/core/src/storybook/components/related-components/descriptions/tab-description.jsx
+++ b/packages/core/src/storybook/components/related-components/descriptions/tab-description.jsx
@@ -5,11 +5,8 @@ import TabList from "../../../../components/Tabs/TabList/TabList";
 
 export const TabsDescription = () => {
   const component = useMemo(() => {
-    const style = {
-      marginLeft: "-40px"
-    };
     return (
-      <div style={style}>
+      <div>
         <TabList>
           <Tab>Tab</Tab>
           <Tab>Tab</Tab>