diff --git a/Bootstrap.Client/Views/Shared/Menu.cshtml b/Bootstrap.Client/Views/Shared/Menu.cshtml
index f8b8d885..0e7c8b36 100644
--- a/Bootstrap.Client/Views/Shared/Menu.cshtml
+++ b/Bootstrap.Client/Views/Shared/Menu.cshtml
@@ -1,5 +1,6 @@
 @model IEnumerable<Bootstrap.Security.BootstrapMenu>
 <div class="dropdown-menu">
+    <div class="dropdown-menu-arrow"></div>
     @foreach (var menu in Model)
     {
         <a href="@Url.Content(menu.Url)" class="dropdown-item @menu.Active" target="@menu.Target"><i class="@menu.Icon"></i><span>@menu.Name</span></a>
diff --git a/Bootstrap.Client/wwwroot/css/site.css b/Bootstrap.Client/wwwroot/css/site.css
index 5a735f4e..68f95e3e 100644
--- a/Bootstrap.Client/wwwroot/css/site.css
+++ b/Bootstrap.Client/wwwroot/css/site.css
@@ -32,6 +32,33 @@
         padding: 0 0 0 1rem;
     }
 
+        .header .navbar .dropdown-menu .dropdown-item {
+            position: relative;
+        }
+
+        .header .navbar .dropdown-menu-arrow {
+            width: 0;
+            height: 0;
+            border-width: 0 6px 6px;
+            border-style: solid;
+            border-color: transparent transparent rgba(0,0,0,.15);
+            position: relative;
+            left: 16px;
+            margin-top: -6px;
+        }
+
+            .header .navbar .dropdown-menu-arrow:after {
+                content: " ";
+                width: 0;
+                height: 0;
+                border-width: 0 6px 6px;
+                border-style: solid;
+                border-color: transparent transparent #fff;
+                position: absolute;
+                top: 1px;
+                left: -6px;
+            }
+
 .sidebar-toggle-box {
     color: #eee;
 }