diff --git a/_sass/_navigation.scss b/_sass/_navigation.scss
index 08ba30e3..a5b30144 100644
--- a/_sass/_navigation.scss
+++ b/_sass/_navigation.scss
@@ -431,7 +431,7 @@
   @include breakpoint(max-width ($large - 1px)) {
     position: relative;
     max-height: 0;
-    opacity: 0;
+    opacity: 0%;
     overflow: hidden;
     z-index: 10;
     -webkit-transition: 0.3s ease-in-out;
@@ -446,7 +446,7 @@
   .nav__list input:checked ~ .nav__items {
     -webkit-transition: 0.5s ease-in-out;
     transition: 0.5s ease-in-out;
-    max-height: 100vh;
+    max-height: 9999px; // exaggerate max-height to accommodate tall lists
     overflow: visible;
     opacity: 1;
     margin-top: 1em;
diff --git a/docs/_sass/_navigation.scss b/docs/_sass/_navigation.scss
index 08ba30e3..a5b30144 100644
--- a/docs/_sass/_navigation.scss
+++ b/docs/_sass/_navigation.scss
@@ -431,7 +431,7 @@
   @include breakpoint(max-width ($large - 1px)) {
     position: relative;
     max-height: 0;
-    opacity: 0;
+    opacity: 0%;
     overflow: hidden;
     z-index: 10;
     -webkit-transition: 0.3s ease-in-out;
@@ -446,7 +446,7 @@
   .nav__list input:checked ~ .nav__items {
     -webkit-transition: 0.5s ease-in-out;
     transition: 0.5s ease-in-out;
-    max-height: 100vh;
+    max-height: 9999px; // exaggerate max-height to accommodate tall lists
     overflow: visible;
     opacity: 1;
     margin-top: 1em;