diff --git a/packages/core/component-doc.json b/packages/core/component-doc.json
index 3786ee17195..4a0d82ec644 100644
--- a/packages/core/component-doc.json
+++ b/packages/core/component-doc.json
@@ -10507,7 +10507,7 @@
             "resolved": "string",
             "references": {}
           },
-          "mutable": false,
+          "mutable": true,
           "attr": "icon",
           "reflectToAttr": false,
           "docs": "Name of the icon you want to display. Icon names can be resolved from the documentation",
@@ -10554,7 +10554,7 @@
             "resolved": "string",
             "references": {}
           },
-          "mutable": false,
+          "mutable": true,
           "attr": "tab-icon",
           "reflectToAttr": false,
           "docs": "Name of the icon you want to display. Icon names can be resolved from the documentation",
@@ -10568,7 +10568,6 @@
               "text": "since 2.0.0 use `icon` property. Will be removed in 3.0.0"
             }
           ],
-          "default": "'document'",
           "deprecation": "since 2.0.0 use `icon` property. Will be removed in 3.0.0",
           "values": [
             {
diff --git a/packages/core/src/components/menu-category/menu-category.scss b/packages/core/src/components/menu-category/menu-category.scss
index 0c4bf001b21..3f55c9404ca 100644
--- a/packages/core/src/components/menu-category/menu-category.scss
+++ b/packages/core/src/components/menu-category/menu-category.scss
@@ -8,6 +8,7 @@
  */
 
 @import 'mixins/shadow-dom/component';
+@import 'mixins/text-truncation';
 
 :host {
   @include ix-component;
@@ -23,6 +24,12 @@
     height: 100%;
   }
 
+  .category-text {
+    width: 100%;
+    padding-right: 0.25rem;
+    @include ellipsis;
+  }
+
   .category-chevron {
     margin-left: auto;
     margin-right: 0px;
@@ -44,6 +51,10 @@
     max-height: 999999999px;
   }
 
+  .menu-items--collapsed {
+    display: none;
+  }
+
   .category-dropdown {
     ::slotted(ix-menu-item) {
       --ix-menu-item-height: 2.5rem;
@@ -52,6 +63,7 @@
 
   .category-dropdown-header {
     pointer-events: none;
+    padding-left: 0.125rem;
     min-width: 256px;
   }
 
diff --git a/packages/core/src/components/menu-category/menu-category.tsx b/packages/core/src/components/menu-category/menu-category.tsx
index dbbedd9b414..7fdc8390022 100644
--- a/packages/core/src/components/menu-category/menu-category.tsx
+++ b/packages/core/src/components/menu-category/menu-category.tsx
@@ -171,7 +171,7 @@ export class MenuCategory {
           onClick={(e) => this.onCategoryClicked(e)}
         >
           <div class="category">
-            {this.label}
+            <div class="category-text">{this.label}</div>
             <ix-icon
               name={'chevron-down-small'}
               class={{
@@ -186,6 +186,7 @@ export class MenuCategory {
           class={{
             'menu-items': true,
             'menu-items--expanded': this.showItems,
+            'menu-items--collapsed': !this.showItems,
           }}
         >
           {this.showItems ? <slot></slot> : null}
diff --git a/packages/core/src/components/menu-category/test/menu-category.ct.ts b/packages/core/src/components/menu-category/test/menu-category.ct.ts
index e082821cd78..d88337979c1 100644
--- a/packages/core/src/components/menu-category/test/menu-category.ct.ts
+++ b/packages/core/src/components/menu-category/test/menu-category.ct.ts
@@ -118,7 +118,9 @@ test('should show items as dropdown', async ({ mount, page }) => {
 
   const dropdown = menuCategory.locator('ix-dropdown');
   await expect(dropdown).toBeVisible();
-  await expect(menuCategory.locator('.menu-items')).toHaveClass('menu-items');
+  await expect(menuCategory.locator('.menu-items')).toHaveClass(
+    'menu-items menu-items--collapsed'
+  );
 
   const dropdownHeader = dropdown.locator('ix-dropdown-item');
   await expect(dropdownHeader).toHaveText('Category label');
@@ -164,5 +166,38 @@ test('should collapse category after collapse menu', async ({
   );
 
   await menuButton.click();
-  await expect(menuCategory.locator('.menu-items')).toHaveClass('menu-items');
+  await expect(menuCategory.locator('.menu-items')).toHaveClass(
+    'menu-items menu-items--collapsed'
+  );
+});
+
+test('should hide menu-items when collapsed', async ({ mount, page }) => {
+  await mount(`
+    <ix-basic-navigation>
+      <ix-menu>
+        <ix-menu-category label="Category label">
+          <ix-menu-item>Test Item 1</ix-menu-item>
+          <ix-menu-item>Test Item 2</ix-menu-item>
+        </ix-menu-category>
+      </ix-menu>
+    </ix-basic-navigation>
+  `);
+
+  await page.waitForSelector('ix-menu');
+  const menu = page.locator('ix-menu');
+  await page
+    .locator('ix-basic-navigation')
+    .evaluate(
+      (menu: HTMLIxBasicNavigationElement) => (menu.breakpoints = ['md'])
+    );
+
+  const menuButton = menu.locator('ix-burger-menu');
+  await menuButton.click();
+
+  const menuCategory = page.locator('ix-menu-category');
+
+  await expect(menuCategory.locator('.menu-items')).toHaveClass(
+    'menu-items menu-items--collapsed'
+  );
+  await expect(menuCategory.locator('.menu-items')).toBeHidden();
 });
diff --git a/packages/core/src/components/menu-item/menu-item.scss b/packages/core/src/components/menu-item/menu-item.scss
index 854236756f4..af866e6bf36 100644
--- a/packages/core/src/components/menu-item/menu-item.scss
+++ b/packages/core/src/components/menu-item/menu-item.scss
@@ -56,7 +56,7 @@ $menuItemPadding: 0.875rem;
     display: inline-flex;
     position: absolute;
     top: 0.25rem;
-    left: 1.75rem;
+    left: 1.5rem;
 
     .pill {
       display: inline-flex;
@@ -159,7 +159,28 @@ $menuItemPadding: 0.875rem;
 }
 
 :host(.tab-nested) {
-  .tab::before {
-    display: none;
+  .tab {
+    flex-direction: row;
+    padding-left: calc(0.5rem + $menuItemPadding);
+
+    .notification {
+      position: relative;
+      top: 0;
+      left: 0;
+      padding-left: 0.5rem;
+    }
+
+    .tab-icon {
+      padding-left: 0.5rem;
+      padding-right: 0.5rem;
+    }
+
+    .tab-text {
+      margin-left: 0.5rem;
+    }
+
+    &::before {
+      display: none;
+    }
   }
 }
diff --git a/packages/core/src/components/menu-item/menu-item.tsx b/packages/core/src/components/menu-item/menu-item.tsx
index 99d380bff2c..cede08e2027 100644
--- a/packages/core/src/components/menu-item/menu-item.tsx
+++ b/packages/core/src/components/menu-item/menu-item.tsx
@@ -7,7 +7,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { Component, Element, h, Host, Prop, State } from '@stencil/core';
+import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';
 import { createMutationObserver } from '../utils/mutation-observer';
 
 /**
@@ -36,12 +36,12 @@ export class MenuItem {
    *
    * @deprecated since 2.0.0 use `icon` property. Will be removed in 3.0.0
    */
-  @Prop() tabIcon = 'document';
+  @Prop({ mutable: true }) tabIcon: string;
 
   /**
    * Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons
    */
-  @Prop() icon: string;
+  @Prop({ mutable: true }) icon: string;
 
   /**
    * Show notification count on tab
@@ -68,6 +68,9 @@ export class MenuItem {
   componentWillLoad() {
     this.isHostedInsideCategory =
       !!this.hostElement.closest('ix-menu-category');
+
+    this.onIconChange();
+    this.onTabIconChange();
   }
 
   componentWillRender() {
@@ -92,6 +95,28 @@ export class MenuItem {
     }
   }
 
+  @Watch('icon')
+  onIconChange() {
+    if (
+      !this.isHostedInsideCategory &&
+      !this.hostElement.icon &&
+      !this.hostElement.tabIcon
+    ) {
+      this.icon = 'document';
+    }
+  }
+
+  @Watch('tabIcon')
+  onTabIconChange() {
+    if (
+      !this.isHostedInsideCategory &&
+      !this.hostElement.icon &&
+      !this.hostElement.tabIcon
+    ) {
+      this.tabIcon = 'document';
+    }
+  }
+
   render() {
     let extendedAttributes = {};
     if (this.home) {
@@ -122,15 +147,17 @@ export class MenuItem {
           tabIndex={this.disabled ? -1 : 0}
           role="listitem"
         >
-          <ix-icon
-            class={'tab-icon'}
-            name={this.icon ?? this.tabIcon}
-          ></ix-icon>
-          <div class="notification">
-            {this.notifications ? (
+          {(this.icon || this.tabIcon) && (
+            <ix-icon
+              class={'tab-icon'}
+              name={this.icon ?? this.tabIcon}
+            ></ix-icon>
+          )}
+          {this.notifications ? (
+            <div class="notification">
               <div class="pill">{this.notifications}</div>
-            ) : null}
-          </div>
+            </div>
+          ) : null}
           <span class="tab-text text-default">
             <slot></slot>
           </span>
diff --git a/packages/core/src/tests/menu/basic/index.html b/packages/core/src/tests/menu/basic/index.html
new file mode 100644
index 00000000000..ae8dd683bc4
--- /dev/null
+++ b/packages/core/src/tests/menu/basic/index.html
@@ -0,0 +1,31 @@
+<!--
+SPDX-FileCopyrightText: 2023 Siemens AG
+
+SPDX-License-Identifier: MIT
+-->
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8"/>
+    <meta
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"
+      name="viewport"
+    />
+    <title>Stencil Component Starter</title>
+  </head>
+  <body style="width: 100vw; height: 100vh">
+    <ix-basic-navigation>
+      <ix-menu>
+        <ix-menu-item>Item 1</ix-menu-item>
+        <ix-menu-category label="Category with a long name">
+            <ix-menu-item icon="home" notifications="10">Sub 1</ix-menu-item>
+            <ix-menu-item notifications="7">Sub 2</ix-menu-item>
+            <ix-menu-item icon="star">Sub 3</ix-menu-item>
+            <ix-menu-item>Sub 4</ix-menu-item>
+        </ix-menu-category>
+      </ix-menu>
+    </ix-basic-navigation>
+    <script src="http://127.0.0.1:8080/scripts/e2e/load-e2e-runtime.js"></script>
+  </body>
+</html>
diff --git a/packages/core/src/tests/menu/link/index.html b/packages/core/src/tests/menu/link/index.html
new file mode 100644
index 00000000000..f08838c53ae
--- /dev/null
+++ b/packages/core/src/tests/menu/link/index.html
@@ -0,0 +1,41 @@
+<!--
+SPDX-FileCopyrightText: 2023 Siemens AG
+
+SPDX-License-Identifier: MIT
+-->
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8"/>
+    <meta
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"
+      name="viewport"
+    />
+    <title>Stencil Component Starter</title>
+  </head>
+  <body style="width: 100vw; height: 100vh">
+    <ix-basic-navigation>
+      <ix-menu>
+        <a href="#link1">
+          <ix-menu-item>Link 1</ix-menu-item>
+        </a>
+        <ix-menu-category label="Category">
+          <a href="#link2">
+            <ix-menu-item>Link 2</ix-menu-item>
+          </a>
+          <a href="#link3">
+            <ix-menu-item active>Link 3</ix-menu-item>
+          </a>
+          <a href="#link4">
+            <ix-menu-item>Link 4</ix-menu-item>
+          </a>
+          <a href="#link5">
+            <ix-menu-item>Link 5</ix-menu-item>
+          </a>
+        </ix-menu-category>
+      </ix-menu>
+    </ix-basic-navigation>
+    <script src="http://127.0.0.1:8080/scripts/e2e/load-e2e-runtime.js"></script>
+  </body>
+</html>
diff --git a/packages/core/src/tests/menu/menu.e2e.ts b/packages/core/src/tests/menu/menu.e2e.ts
index 09de1f8f18d..b3117061417 100644
--- a/packages/core/src/tests/menu/menu.e2e.ts
+++ b/packages/core/src/tests/menu/menu.e2e.ts
@@ -7,52 +7,60 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { expect } from '@playwright/test';
-import { test, viewPorts } from '@utils/test';
-
-test('should render menu items with a[href]', async ({ mount, page }) => {
-  await page.setViewportSize(viewPorts.lg);
-  await mount(`
-  <ix-basic-navigation>
-    <ix-menu>
-      <a href="#link1">
-        <ix-menu-item>Link 1</ix-menu-item>
-      </a>
-      <ix-menu-category label="Sub">
-        <a href="#link2">
-          <ix-menu-item>Link 2</ix-menu-item>
-        </a>
-        <a href="#link3">
-          <ix-menu-item active>Link 3</ix-menu-item>
-        </a>
-        <a href="#link4">
-          <ix-menu-item>Link 4</ix-menu-item>
-        </a>
-        <a href="#link5">
-          <ix-menu-item>Link 5</ix-menu-item>
-        </a>
-      </ix-menu-category>
-    </ix-menu>
-  </ix-basic-navigation>`);
-
-  const basicNavigationElement = page.locator('ix-basic-navigation');
-
-  const category = page.locator('ix-menu-category');
-  await category.click();
-
-  const link1 = page.getByText('Link 1');
-  await expect(link1).toBeVisible();
-
-  const link2 = page.getByText('Link 2');
-  await expect(link2).toBeVisible();
-
-  await link2.hover();
-
-  await page.waitForTimeout(1000);
-
-  expect(
-    await basicNavigationElement.screenshot({
-      animations: 'disabled',
-    })
-  ).toMatchSnapshot();
+import { expect, test } from '@playwright/test';
+import { regressionTest, viewPorts } from '@utils/test';
+
+test.describe('menu', () => {
+  regressionTest(
+    'basic md - no default icon on second level, scaling for popup window',
+    async ({ page }) => {
+      await page.setViewportSize(viewPorts.md);
+      await page.goto('menu/basic');
+
+      const category = page.locator('ix-menu-category');
+      await category.click();
+
+      await page.waitForTimeout(1000);
+
+      await expect(page).toHaveScreenshot();
+    }
+  );
+
+  regressionTest(
+    'basic lg - no default icon on second level, visible ellipsis for category',
+    async ({ page }) => {
+      await page.setViewportSize(viewPorts.lg);
+      await page.goto('menu/basic');
+
+      const category = page.locator('ix-menu-category');
+      await category.click();
+
+      await page.waitForTimeout(1000);
+
+      await expect(page).toHaveScreenshot();
+    }
+  );
+
+  regressionTest(
+    'link - should render menu items with a[href]',
+    async ({ page }) => {
+      await page.setViewportSize(viewPorts.lg);
+      await page.goto('menu/link');
+
+      const category = page.locator('ix-menu-category');
+      await category.click();
+
+      const link1 = page.getByText('Link 1');
+      await expect(link1).toBeVisible();
+
+      const link2 = page.getByText('Link 2');
+      await expect(link2).toBeVisible();
+
+      await link2.hover();
+
+      await page.waitForTimeout(1000);
+
+      await expect(page).toHaveScreenshot();
+    }
+  );
 });
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-lg---no-default-icon-on-second-level-visible-ellipsis-for-category-1-chromium---theme-classic-dark-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-lg---no-default-icon-on-second-level-visible-ellipsis-for-category-1-chromium---theme-classic-dark-linux.png
new file mode 100644
index 00000000000..0a79112cdd6
Binary files /dev/null and b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-lg---no-default-icon-on-second-level-visible-ellipsis-for-category-1-chromium---theme-classic-dark-linux.png differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-lg---no-default-icon-on-second-level-visible-ellipsis-for-category-1-chromium---theme-classic-light-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-lg---no-default-icon-on-second-level-visible-ellipsis-for-category-1-chromium---theme-classic-light-linux.png
new file mode 100644
index 00000000000..50923a778eb
Binary files /dev/null and b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-lg---no-default-icon-on-second-level-visible-ellipsis-for-category-1-chromium---theme-classic-light-linux.png differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-md---no-default-icon-on-second-level-scaling-for-popup-window-1-chromium---theme-classic-dark-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-md---no-default-icon-on-second-level-scaling-for-popup-window-1-chromium---theme-classic-dark-linux.png
new file mode 100644
index 00000000000..5a58c347408
Binary files /dev/null and b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-md---no-default-icon-on-second-level-scaling-for-popup-window-1-chromium---theme-classic-dark-linux.png differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-md---no-default-icon-on-second-level-scaling-for-popup-window-1-chromium---theme-classic-light-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-md---no-default-icon-on-second-level-scaling-for-popup-window-1-chromium---theme-classic-light-linux.png
new file mode 100644
index 00000000000..479faa2f9df
Binary files /dev/null and b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-basic-md---no-default-icon-on-second-level-scaling-for-popup-window-1-chromium---theme-classic-light-linux.png differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-link---should-render-menu-items-with-a-href-1-chromium---theme-classic-dark-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-link---should-render-menu-items-with-a-href-1-chromium---theme-classic-dark-linux.png
new file mode 100644
index 00000000000..69d7fcbb272
Binary files /dev/null and b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-link---should-render-menu-items-with-a-href-1-chromium---theme-classic-dark-linux.png differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-link---should-render-menu-items-with-a-href-1-chromium---theme-classic-light-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-link---should-render-menu-items-with-a-href-1-chromium---theme-classic-light-linux.png
new file mode 100644
index 00000000000..d8023b44b2e
Binary files /dev/null and b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/menu-link---should-render-menu-items-with-a-href-1-chromium---theme-classic-light-linux.png differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/should-render-menu-items-with-a-href-1-chromium---theme-classic-dark-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/should-render-menu-items-with-a-href-1-chromium---theme-classic-dark-linux.png
deleted file mode 100644
index aacb160cf12..00000000000
Binary files a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/should-render-menu-items-with-a-href-1-chromium---theme-classic-dark-linux.png and /dev/null differ
diff --git a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/should-render-menu-items-with-a-href-1-chromium---theme-classic-light-linux.png b/packages/core/src/tests/menu/menu.e2e.ts-snapshots/should-render-menu-items-with-a-href-1-chromium---theme-classic-light-linux.png
deleted file mode 100644
index 09869558437..00000000000
Binary files a/packages/core/src/tests/menu/menu.e2e.ts-snapshots/should-render-menu-items-with-a-href-1-chromium---theme-classic-light-linux.png and /dev/null differ