Fix dropdown arrows being misaligned in some browsers

diff --git a/docs/assets/scss/_topbar.scss b/docs/assets/scss/_topbar.scss
index 7b1b9277210bf4a98da332b52f6a57ff072fa9cb..29606278f4a39db756f540180977efee019898f4 100644 (file)
--- a/docs/assets/scss/_topbar.scss
+++ b/docs/assets/scss/_topbar.scss
@@ -65,8 +65,13 @@ $topbar-hover-color: darken($topbar-background, 20%);
     border: 0;
   }
 
+  .is-down-arrow a {
+    padding-right: 2rem !important;
+  }
+
   .is-down-arrow a::after {
-    margin-top: 20px !important;
+    margin-top: 8px !important;
+    right: 12px !important;
     border-top-color: white !important;
   }
 }

diff --git a/scss/components/_dropdown-menu.scss b/scss/components/_dropdown-menu.scss
index ae4b3501aa5be1d16162e7a778238d6602b746e2..10dd040b60db492d4f29f0d7071fcbc5196c54f5 100644 (file)
--- a/scss/components/_dropdown-menu.scss
+++ b/scss/components/_dropdown-menu.scss
@@ -34,8 +34,15 @@ $dropdown-border: 1px solid $medium-gray !default;
       }
 
       @if $dropdownmenu-arrows {
+        &.is-down-arrow a {
+          padding-right: 1.5rem;
+          position: relative;
+        }
         &.is-down-arrow > a::after {
           @include css-triangle(5px, $anchor-color, down);
+          position: absolute;
+          top: 12px;
+          right: 5px;
         }
         &.is-left-arrow > a::after {
           @include css-triangle(5px, $anchor-color, left);