diff --git a/examples/templates/example.html b/examples/templates/example.html
index b85caf89ae..341c253330 100644
--- a/examples/templates/example.html
+++ b/examples/templates/example.html
@@ -86,7 +86,7 @@
         <ul class="nav navbar-nav ml-auto" >
           <li class="nav-item dropdown">
             <a class="nav-link dropdown-toggle" href="#" id="docdropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Docs</a>
-            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="docdropdown">
+            <div class="dropdown-menu dropdown-menu-right mb-3" aria-labelledby="docdropdown">
               <a class="dropdown-item" href="../doc/">Docs</a>
               <div class="dropdown-divider"></div>
                 <a class="dropdown-item" href="../doc/quickstart.html"><i class="fa fa-check fa-fw mr-2 fa-lg"></i>Quick Start</a>
@@ -101,7 +101,7 @@
           <li class="nav-item"><a class="nav-link" href="../apidoc/"><i class="fa fa-sitemap mr-1"></i>API</a></li>
           <li class="nav-item dropdown">
             <a class="nav-link dropdown-toggle" href="#" id="codedropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Code</a>
-            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="codedropdown">
+            <div class="dropdown-menu dropdown-menu-right mb-3" aria-labelledby="codedropdown">
               <a class="dropdown-item" href="https://github.com/openlayers/openlayers"><i class="fa fa-github fa-fw mr-2 fa-lg"></i>Repository</a>
               <a class="dropdown-item" href="../download/"><i class="fa fa-download fa-fw mr-2 fa-lg"></i>Download</a>
             </div>