Fixed positioning of SelectSearch, Popup and MultiDropDown popups

.github/workflows/pipeline.yaml

@@ -19,15 +19,31 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v4
+
+      # Install caches
+      - name: Install sccache
+        uses: mozilla-actions/sccache-action@v0.0.6
+      - name: Cache cargo registry and index
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/registry
+            ~/.cargo/index
+          key: ${{ runner.os }}-cargo-registry-${{ hashFiles('**/Cargo.lock') }}
+      - name: Cache cargo target
+        uses: actions/cache@v4
+        with:
+          path: target
+          key: ${{ runner.os }}-cargo-target-${{ hashFiles('**/Cargo.lock') }}
+
+      # Install toolchain
       - name: Install toolchain
         uses: actions-rs/toolchain@v1
         with:
           toolchain: nightly
           target: wasm32-unknown-unknown
           components: clippy, rustfmt
           override: true
-      - name: Install sccache
-        uses: mozilla-actions/sccache-action@v0.0.6
 
       # Formatting check
       - name: Check formatting

CHANGES.md

@@ -1,6 +1,12 @@
 <!-- markdownlint-configure-file { "no-duplicate-heading": { "siblings_only": true } } -->
 
 <!-- markdownlint-disable-next-line first-line-h1 -->
+## Unreleased
+
+### Fixed
+
+* Fixed positioning of `SelectSearch`, `Popup` and `MultiDropDown` popups
+
 ## 0.1.3 - 2026-03-05
 
 ### Added

src/popup.rs

@@ -8,7 +8,7 @@ pub struct PopupParams {
 fn popup_css() -> Css {
     css! {"
         visibility: hidden;
-        position: absolute;
+        position: fixed;
         z-index: 1;
     "}
 }

src/select/multi_drop_down.rs

@@ -32,7 +32,7 @@ where
             }
         });
         let content_css = css! {"
-            position: absolute;
+            position: fixed;
             z-index: 1;
         "};
         let drop_down_content_css = content_css + self.params.drop_down_content_css;

src/select_search.rs

@@ -68,11 +68,10 @@ pub fn SelectSearch<K, V>(
         let display_value = if visible { "block" } else { "none" };
         css! {"
             display: {display_value};
-            position: absolute;
+            position: fixed;
             background-color: white;
             box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.4);
             border: 1px black solid;
-            z-index: 1;
         "}
     };