Kevin Powell - Community•2mo ago

horizontal scroll

actually i am working on my portfolio website i want to scroll through different section of my page, i used this : html{ horizontal-scroll: smooth; } it is fine but for some sections the scrolling is more, like some part of the section is scrolled more than it has to be. How do i solve this

5 Replies

lko•2mo ago

Wdym? Like it covers part of the section?

Tok124 (CSS Nerd)•2mo ago

Have you tried using the scroll-padding property?

Tok124 (CSS Nerd)•2mo ago

https://www.youtube.com/watch?v=iGUSTyG-CYw

Kevin Powell

YouTube

Stop fixed navigations covering content on scroll

When we have a fixed navigation with anchor links that go to different locations within the page, that navigation can cover content when it scrolls to that location on the page. Luckily, it's easy to fix with some scroll-padding! 🔗 Links ✅ The CodePen: https://codepen.io/kevinpowell/pen/GRQyZMX ✅ More position sticky stuff: https://youtu.be/8T...

clevermissfox•2mo ago

horizontal-scroll is not a valid property, I think you intended

html { scroll-behavior: smooth; }

html { scroll-behavior: smooth; }

Also recommend putting it into an

@media (prefers-reduced-motion: no-preference ) {
  html { scroll-behavior: smooth; } 
}

@media (prefers-reduced-motion: no-preference ) {
  html { scroll-behavior: smooth; } 
}

Vishwa Teja Reddy•2mo ago

okay thank you👍

Gaming

Programming

horizontal scroll