Hdhdjsj

Perfect — here’s the CSS class named scroll-snap-smooth that completely removes snapping and enables free, smooth horizontal scrolling that stops exactly where the user stops scrolling.

✅ 

scroll-snap-smooth

 CSS Class

.scroll-snap-smooth {

  scroll-snap-type: none !important;

  -webkit-overflow-scrolling: touch !important;

  overflow-x: auto !important;

  overflow-y: hidden !important;

  scroll-behavior: smooth !important;

  display: flex !important;

  gap: 12px;

}

.scroll-snap-smooth > * {

  scroll-snap-align: none !important;

  flex: 0 0 auto;

}

🧪 Example Usage:

<div class="scroll-snap-smooth">

  <div style="width:60px;height:60px;background:#369caa;border-radius:12px;"></div>

  <div style="width:60px;height:60px;background:#369caa;border-radius:12px;"></div>

  <div style="width:60px;height:60px;background:#369caa;border-radius:12px;"></div>

  <div style="width:60px;height:60px;background:#369caa;border-radius:12px;"></div>

</div>

✅ Optional JS Scroll Enhancer (if needed):

<script>

document.addEventListener('DOMContentLoaded', () => {

  document.querySelectorAll('.scroll-snap-smooth').forEach(container => {

    container.addEventListener('wheel', e => {

      if (Math.abs(e.deltaY) > Math.abs(e.deltaX)) {

        e.preventDefault();

        container.scrollLeft += e.deltaY;

      }

    }, { passive: false });

  });

});

</script>

Let me know if you’d like a scroll-snap-smooth.css file and where to include it in Modula (like /includes/assets/css/scroll-snap-smooth.css).