diff --git a/webview/src/plots/components/PlotsContainer.tsx b/webview/src/plots/components/PlotsContainer.tsx
index 5edfab12cb..f3e551c0d6 100644
--- a/webview/src/plots/components/PlotsContainer.tsx
+++ b/webview/src/plots/components/PlotsContainer.tsx
@@ -48,6 +48,7 @@ export const PlotsContainer: React.FC<PlotsContainerProps> = ({
   const maxNbPlotsPerRow = useSelector(
     (state: PlotsState) => state.webview.maxNbPlotsPerRow
   )
+  const ribbonHeight = useSelector((state: PlotsState) => state.ribbon.height)
 
   useEffect(() => {
     window.dispatchEvent(new Event('resize'))
@@ -116,6 +117,7 @@ export const PlotsContainer: React.FC<PlotsContainerProps> = ({
       {changeNbItemsPerRow && hasItems && maxNbPlotsPerRow > 1 && (
         <div
           className={styles.nbItemsPerRowSlider}
+          style={{ top: ribbonHeight - 4 }}
           data-testid="nb-items-per-row-slider"
         >
           <MinMaxSlider
@@ -125,6 +127,7 @@ export const PlotsContainer: React.FC<PlotsContainerProps> = ({
             onChange={handleResize}
             defaultValue={-nbItemsPerRow}
           />
+          main
         </div>
       )}
       {open && (
diff --git a/webview/src/plots/components/styles.module.scss b/webview/src/plots/components/styles.module.scss
index d3d17a162e..2f3cb3b076 100644
--- a/webview/src/plots/components/styles.module.scss
+++ b/webview/src/plots/components/styles.module.scss
@@ -225,9 +225,15 @@ $gap: 20px;
 }
 
 .nbItemsPerRowSlider {
+  position: sticky;
+  right: 0;
+  top: 0;
+  width: 100%;
   display: flex;
   justify-content: end;
-  margin: 20px;
+  padding: 20px;
+  background-color: $bg-color;
+  z-index: 3;
 }
 
 :global(.has-actions) {