diff --git a/swh/web/assets/src/bundles/browse/browse-utils.js b/swh/web/assets/src/bundles/browse/browse-utils.js
--- a/swh/web/assets/src/bundles/browse/browse-utils.js
+++ b/swh/web/assets/src/bundles/browse/browse-utils.js
@@ -22,6 +22,14 @@
     boundary: 'viewport',
     container: 'body',
     html: true,
+    placement: function() {
+      const width = $(window).width();
+      if (width < 768) {
+        return 'top';
+      } else {
+        return 'right';
+      }
+    },
     template: `<div class="popover" role="tooltip">
                  <div class="arrow"></div>
                  <h3 class="popover-header"></h3>
diff --git a/swh/web/assets/src/bundles/browse/browse.css b/swh/web/assets/src/bundles/browse/browse.css
--- a/swh/web/assets/src/bundles/browse/browse.css
+++ b/swh/web/assets/src/bundles/browse/browse.css
@@ -80,13 +80,18 @@
 
 .swh-popover {
     max-height: 50vh;
-    max-width: 80vw;
     overflow-y: auto;
     overflow-x: auto;
     padding: 0;
     padding-right: 1.4em;
 }
 
+@media screen and (min-width: 768px) {
+    .swh-popover {
+        max-width: 80vh;
+    }
+}
+
 .swh-search-pagination {
     margin-top: 5px;
 }
diff --git a/swh/web/assets/src/bundles/webapp/webapp.css b/swh/web/assets/src/bundles/webapp/webapp.css
--- a/swh/web/assets/src/bundles/webapp/webapp.css
+++ b/swh/web/assets/src/bundles/webapp/webapp.css
@@ -168,8 +168,8 @@
 }
 
 .popover {
-    max-width: 100%;
-    z-index: 2000;
+    max-width: 97%;
+    z-index: 40000;
 }
 
 .modal {