diff --git a/customize.dist/src/less2/include/sidebar-layout.less b/customize.dist/src/less2/include/sidebar-layout.less
index 86eab5a38..985d20afe 100644
--- a/customize.dist/src/less2/include/sidebar-layout.less
+++ b/customize.dist/src/less2/include/sidebar-layout.less
@@ -46,6 +46,14 @@
                 .cp-sidebarlayout-category {
                     display: flex;
                     align-items: center;
+                    white-space: nowrap;
+                    svg {
+                        flex: 0 0 auto;
+                    }
+                    .cp-sidebarlayout-category-name {
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                    }
                     .leftside-menu-category_main();
                     box-shadow: @cryptpad_ui_shadow;
                     &:focus-visible {
diff --git a/www/common/inner/sidebar-layout.js b/www/common/inner/sidebar-layout.js
index 6422d945b..b20ac9fcf 100644
--- a/www/common/inner/sidebar-layout.js
+++ b/www/common/inner/sidebar-layout.js
@@ -370,15 +370,17 @@ define([
             Object.keys(categories).forEach(function (key, i) {
                 if (!active && !i) { active = key; }
                 var category = categories[key];
+                var name = category.name || Messages[`${app}_cat_${key}`] || key;
                 var icon;
                 if (category.icon) { icon = Icons.get(category.icon); }
                 var item = h('li.cp-sidebarlayout-category', {
                     'role': 'menuitem',
                     'tabindex': 0,
-                    'data-category': key
+                    'data-category': key,
+                    'aria-label': name
                 }, [
                     icon,
-                    category.name || Messages[`${app}_cat_${key}`] || key,
+                    h('span.cp-sidebarlayout-category-name', name),
                 ]);
                 var $item = $(item).appendTo(container);
                 Util.onClickEnter($item, function () {
diff --git a/www/notifications/inner.js b/www/notifications/inner.js
index 1c0700ba1..31f8fd384 100644
--- a/www/notifications/inner.js
+++ b/www/notifications/inner.js
@@ -218,7 +218,8 @@ define([
         var active = privateData.category || 'all';
         common.setHash(active);
         Object.keys(categories).forEach(function (key) {
-            var $category = $('<div>', {'class': 'cp-sidebarlayout-category', 'tabindex': 0, 'role': 'menuitem'}).appendTo($categories);
+            var name = Messages['notifications_cat_'+key] || key;
+            var $category = $('<div>', {'class': 'cp-sidebarlayout-category', 'tabindex': 0, 'role': 'menuitem', 'aria-label': name}).appendTo($categories);
             if (key === 'all') { $category.append($(Icons.get('all'))); }
             if (key === 'friends') { $category.append($(Icons.get('contacts-book'))); }
             if (key === 'pads') { $category.append($(Icons.get('file-pad'))); }
@@ -245,7 +246,7 @@ define([
                 showCategories(categories[key]);
             });
 
-            $category.append(Messages['notifications_cat_'+key] || key);
+            $category.append(h('span.cp-sidebarlayout-category-name', name));
         });
         showCategories(categories[active]);
     };
diff --git a/www/settings/inner.js b/www/settings/inner.js
index 4b412600d..16057d131 100644
--- a/www/settings/inner.js
+++ b/www/settings/inner.js
@@ -2053,7 +2053,7 @@ define([
     Messages.settings_cat_notifications = Messages.notificationsPage;
     Messages.settings_cat_profile = Messages.profileButton;
     var createLeftside = function() {
-        var $categories = $('<div>', { 'class': 'cp-sidebarlayout-categories' })
+        var $categories = $('<div>', { 'class': 'cp-sidebarlayout-categories', 'role': 'menu'})
             .appendTo(APP.$leftside);
         APP.$usage = $('<div>', { 'class': 'usage' }).appendTo(APP.$leftside);
         var active = privateData.category || 'account';
@@ -2068,11 +2068,13 @@ define([
             let name = SIDEBAR_NAMES[key] ||
                        Messages['settings_cat_' + key] || key;
             var $category = $(h('div.cp-sidebarlayout-category', {
+                'role': 'menuitem',
                 'tabindex': 0,
-                'data-category': key
+                'data-category': key,
+                'aria-label': name
             }, [
                 icon,
-                name,
+                h('span.cp-sidebarlayout-category-name', name),
             ])).appendTo($categories);
 
 
diff --git a/www/support/inner.js b/www/support/inner.js
index e07c9c139..6439d91ef 100644
--- a/www/support/inner.js
+++ b/www/support/inner.js
@@ -296,7 +296,7 @@ define([
     };
 
     var createLeftside = function () {
-        var $categories = $('<div>', {'class': 'cp-sidebarlayout-categories'})
+        var $categories = $('<div>', {'class': 'cp-sidebarlayout-categories', 'role': 'menu'})
                             .appendTo(APP.$leftside);
         var metadataMgr = common.getMetadataMgr();
         var privateData = metadataMgr.getPrivateData();
@@ -304,10 +304,13 @@ define([
         if (!categories[active]) { active = 'tickets'; }
         common.setHash(active);
         Object.keys(categories).forEach(function (key) {
+            var name = Messages['support_cat_'+key] || key;
             var $category = $('<div>', {
                 'class': 'cp-sidebarlayout-category',
                 'data-category': key,
-                'tabindex': 0
+                'tabindex': 0,
+                'role': 'menuitem',
+                'aria-label': name
             }).appendTo($categories);
             var iconClass = icons[key];
             if (iconClass) {
@@ -329,7 +332,7 @@ define([
                 showCategories(categories[key]);
             });
 
-            $category.append(Messages['support_cat_'+key] || key);
+            $category.append(h('span.cp-sidebarlayout-category-name', name));
         });
         showCategories(categories[active]);
     };