diff --git a/index.html b/index.html
index 4a4a4a80..1be1f9bb 100644
--- a/index.html
+++ b/index.html
@@ -5509,8 +5509,8 @@
 
         <div id="markersBottom">
           <button id="markersOverviewRefresh" data-tip="Refresh the Overview screen" class="icon-cw"></button>
-          <select id="addedMarkerType">
-            <option value="" selected>empty marker</option>
+          <select id="addedMarkerType" style="width: 40px">
+            <option value="" selected>❓empty marker</option>
           </select>
           <button
             id="markersAddFromOverview"
diff --git a/modules/ui/markers-overview.js b/modules/ui/markers-overview.js
index a61397b2..fdadf58a 100644
--- a/modules/ui/markers-overview.js
+++ b/modules/ui/markers-overview.js
@@ -25,11 +25,14 @@ function overviewMarkers() {
     position: {my: "right top", at: "right-10 top+10", of: "svg", collision: "fit"}
   });
 
+  const markerTypeInput = document.getElementById("addedMarkerType");
+  markerTypeInput.addEventListener("change", toggleAddMarker);
+
   Markers.getConfig().forEach(markerConfig => {
     const option = document.createElement("option");
     option.setAttribute("value", markerConfig.type);
     option.textContent = `${markerConfig.icon} ${markerConfig.type}`;
-    document.getElementById("addedMarkerType").appendChild(option);
+    markerTypeInput.appendChild(option);
   });
 
   const listeners = [