diff --git a/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuGroup.cs b/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuGroup.cs
index 469c0ad355..1f4b4ac871 100644
--- a/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuGroup.cs
+++ b/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuGroup.cs
@@ -5,6 +5,7 @@ namespace Volo.Abp.UI.Navigation;
 public class ApplicationMenuGroup
 {
     private string _displayName;
+    private string _elementId;
 
     /// <summary>
     /// Default <see cref="Order"/> value of a group item.
@@ -32,7 +33,12 @@ public class ApplicationMenuGroup
     /// <summary>
     /// Can be used to render the element with a specific Id for DOM selections.
     /// </summary>
-    public string ElementId { get; set; }
+    public string ElementId {
+        get { return _elementId; }
+        set {
+            _elementId = NormalizeElementId(value);
+        }
+    }
 
     /// <summary>
     /// The Display order of the group.
@@ -60,6 +66,11 @@ public class ApplicationMenuGroup
         return "MenuGroup_" + Name;
     }
 
+    private string NormalizeElementId(string elementId)
+    {
+        return elementId?.Replace(".", "");
+    }
+
     public override string ToString()
     {
         return $"[ApplicationMenuGroup] Name = {Name}";
diff --git a/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuItem.cs b/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuItem.cs
index dc1614e3e5..b9503874cc 100644
--- a/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuItem.cs
+++ b/framework/src/Volo.Abp.UI.Navigation/Volo/Abp/Ui/Navigation/ApplicationMenuItem.cs
@@ -8,6 +8,7 @@ namespace Volo.Abp.UI.Navigation;
 public class ApplicationMenuItem : IHasMenuItems, IHasSimpleStateCheckers<ApplicationMenuItem>
 {
     private string _displayName;
+    private string _elementId;
 
     /// <summary>
     /// Default <see cref="Order"/> value of a menu item.
@@ -85,7 +86,12 @@ public class ApplicationMenuItem : IHasMenuItems, IHasSimpleStateCheckers<Applic
     /// <summary>
     /// Can be used to render the element with a specific Id for DOM selections.
     /// </summary>
-    public string ElementId { get; set; }
+    public string ElementId {
+        get { return _elementId; }
+        set {
+            _elementId = NormalizeElementId(value);
+        }
+    }
 
     /// <summary>
     /// Can be used to render the element with extra CSS classes.
@@ -151,6 +157,11 @@ public class ApplicationMenuItem : IHasMenuItems, IHasSimpleStateCheckers<Applic
     {
         return "MenuItem_" + Name;
     }
+    
+    private string NormalizeElementId(string elementId)
+    {
+        return elementId?.Replace(".", "");
+    }
 
     public override string ToString()
     {