FIX Prevents horizontal scrollbar in non-firefox

refines #7b430d4 hide elements inside chosen-container if not active
silverstripe · Jan 23, 2024 · 4c53dec · 4c53dec
1 parent 79955d2
commit 4c53dec
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 3 deletions.
diff --git a/client/dist/styles/bundle.css b/client/dist/styles/bundle.css
diff --git a/client/src/styles/_chosen.scss b/client/src/styles/_chosen.scss
@@ -3,3 +3,9 @@
 .chosen-container-multi .chosen-choices {
   padding: 4px 5px;
 }
+
+// Avoid chosen dropdowns overflowing when not active
+// affects non-firefox #1422
+.chosen-container:not(.chosen-container-active) .chosen-drop {
+  overflow: hidden;
+}
diff --git a/client/src/styles/legacy/_preview.scss b/client/src/styles/legacy/_preview.scss
@@ -108,11 +108,14 @@
       width: auto !important;
     }
 
-    .chosen-drop{
+    .chosen-drop {
       padding: 0;
       margin-top: -5px;
       border: 1px solid $dropdown-border-color;
       box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
+      // width & right prevent overflow with non-firefox #1422
+      width: inherit;
+      right: 0;
 
       ul.chosen-results {
         padding: $dropdown-padding-y 0;