diff --git a/web/skins/classic/css/base/skin.css b/web/skins/classic/css/base/skin.css
index 2813c10bb..06d23f1be 100644
--- a/web/skins/classic/css/base/skin.css
+++ b/web/skins/classic/css/base/skin.css
@@ -1109,10 +1109,11 @@ a.flip {
 .tags-container {
   display: flex;
   flex-wrap: wrap;
+  align-items: center;
   border: 1px solid var(--gray);
   border-radius: 4px;
   /*min-height: 35px;*/
-  margin: 0.25rem 1rem 0.25rem 1rem;
+  margin: 0 0 0.5rem 0;
 }
 
 .tags-container button {
@@ -1146,6 +1147,8 @@ a.flip {
   height: 100%;
   border: none;
   width: 100%;
+  min-width: 0;
+  background: transparent;
 }
 
 .tag-input:focus {
@@ -1155,14 +1158,20 @@ a.flip {
 .tag-dropdown {
   vertical-align: center;
   display: inline-block;
+  position: relative;
   flex-grow: 2;
+  min-width: 4em;
 }
 
 .tag-dropdown-content {
   display: none;
   position: absolute;
+  top: 100%;
+  left: 0;
   background-color: #f9f9f9;
-  min-width: 160px;
+  min-width: 100%;
+  width: max-content;
+  max-width: 300px;
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
   z-index: 15;
   padding: 4px 0;
diff --git a/web/skins/classic/views/event.php b/web/skins/classic/views/event.php
index 724fdc857..5ae8c4241 100644
--- a/web/skins/classic/views/event.php
+++ b/web/skins/classic/views/event.php
@@ -272,32 +272,32 @@ if ( $Event->Id() and !file_exists($Event->Path()) )
       </div>
     </div>
 <?php if ( $Event->Id() ) { ?>
-    <div class="tags-container">
-      <div class="tag-dropdown">
-        <!-- input type has to be "search" (not "text") so that the Enter button (not Next) works on mobile Chrome browser. -->
-        <input type="search" id="tagInput" class="tag-input" placeholder="Add tag" data-role="tagsinput">
-        <div class="tag-dropdown-content"></div>
-      </div>
-      <button type="button" id="tagPrevBtn" title="<?php echo translate('Apply the last tag, then play the previous event') ?>" class="inactive" data-on-click-true="tagAndPrev">
-        <i class="material-icons md-18" 
-          style="-moz-transform: scaleX(-1);
-            -o-transform: scaleX(-1);
-            -webkit-transform: scaleX(-1);
-            transform: scaleX(-1);
-            filter: FlipH;
-            -ms-filter: 'FlipH';">
-            label</i>
-      </button>
-      <button type="button" id="tagNextBtn" title="<?php echo translate('Apply the last tag, then play the next event') ?>" class="inactive" data-on-click-true="tagAndNext">
-        <i class="material-icons md-18">label</i>
-      </button>
-    </div>
 <!-- BEGIN VIDEO CONTENT ROW -->
     <div id="inner-content">
       <div class="d-flex flex-row px-3">
         <div class="container-fluid">
           <div class="row row-cols-1 row-cols-sm-2">
-            <div id = "eventStats" class="col col-sm-4 eventStats">
+            <div id = "eventStats" class="col col-sm-3 eventStats">
+              <div class="tags-container">
+                <div class="tag-dropdown">
+                  <!-- input type has to be "search" (not "text") so that the Enter button (not Next) works on mobile Chrome browser. -->
+                  <input type="search" id="tagInput" class="tag-input" placeholder="Add tag" data-role="tagsinput">
+                  <div class="tag-dropdown-content"></div>
+                </div>
+                <button type="button" id="tagPrevBtn" title="<?php echo translate('Apply the last tag, then play the previous event') ?>" class="inactive" data-on-click-true="tagAndPrev">
+                  <i class="material-icons md-18"
+                    style="-moz-transform: scaleX(-1);
+                      -o-transform: scaleX(-1);
+                      -webkit-transform: scaleX(-1);
+                      transform: scaleX(-1);
+                      filter: FlipH;
+                      -ms-filter: 'FlipH';">
+                      label</i>
+                </button>
+                <button type="button" id="tagNextBtn" title="<?php echo translate('Apply the last tag, then play the next event') ?>" class="inactive" data-on-click-true="tagAndNext">
+                  <i class="material-icons md-18">label</i>
+                </button>
+              </div><!--tags-container-->
               <!-- VIDEO STATISTICS TABLE -->
               <table id="eventStatsTable" class="table-sm table-borderless">
                 <!-- EVENT STATISTICS POPULATED BY JAVASCRIPT -->
@@ -336,7 +336,7 @@ if (file_exists($Event->Path().'/objdetect.jpg')) {
 ?>
               </div><!-- id="frames" -->
             </div><!-- id="eventStats" -->
-            <div id="wrapperEventVideo" class="col col-sm-8 pl-0 pr-0">
+            <div id="wrapperEventVideo" class="col col-sm-9 pl-0 pr-0">
               <div id="eventVideo">
               <!-- VIDEO CONTENT -->
                 <div id="videoFeed">
diff --git a/web/skins/classic/views/js/event.js b/web/skins/classic/views/js/event.js
index 246405d10..12ea092e4 100644
--- a/web/skins/classic/views/js/event.js
+++ b/web/skins/classic/views/js/event.js
@@ -1381,7 +1381,7 @@ function onStatsResize(vidWidth) {
     if (eventStats.is(':visible')) {
       eventStats.toggle(false);
       wasHidden = true;
-      wrapperEventVideo.removeClass('col-sm-8').addClass('col-sm-12');
+      wrapperEventVideo.removeClass('col-sm-9').addClass('col-sm-12');
     }
   // Show the stats table if we hid it previously and sufficient room becomes available
   } else if (width >= minWidth) {
@@ -1389,7 +1389,7 @@ function onStatsResize(vidWidth) {
     if ( !eventStats.is(':visible') && wasHidden ) {
       eventStats.toggle(true);
       wasHidden = false;
-      wrapperEventVideo.removeClass('col-sm-12').addClass('col-sm-8');
+      wrapperEventVideo.removeClass('col-sm-12').addClass('col-sm-9');
     }
   }
 }
@@ -1413,10 +1413,10 @@ function initPage() {
 
   if (getEvtStatsCookie() != 'on') {
     eventStats.toggle(false);
-    wrapperEventVideo.removeClass('col-sm-8').addClass('col-sm-12');
+    wrapperEventVideo.removeClass('col-sm-9').addClass('col-sm-12');
   } else {
     onStatsResize(eventData.Width);
-    wrapperEventVideo.removeClass('col-sm-12').addClass('col-sm-8');
+    wrapperEventVideo.removeClass('col-sm-12').addClass('col-sm-9');
   }
   if (eventData.DefaultVideo) {
     canPlayCodec(eventData.DefaultVideo);
@@ -1614,11 +1614,11 @@ function initPage() {
     if (eventStats.is(':visible')) {
       setCookie(cookie, 'off');
       eventStats.toggle(false);
-      wrapperEventVideo.removeClass('col-sm-8').addClass('col-sm-12');
+      wrapperEventVideo.removeClass('col-sm-9').addClass('col-sm-12');
     } else {
       setCookie(cookie, 'on');
       eventStats.toggle(true);
-      wrapperEventVideo.removeClass('col-sm-12').addClass('col-sm-8');
+      wrapperEventVideo.removeClass('col-sm-12').addClass('col-sm-9');
     }
     changeScale();
   });