# Help with horizontal scrolling

**URL:** <https://community.weweb.io/t/help-with-horizontal-scrolling/6202>\
**Category:** Ask us anything\
**Created:** [January 4, 2024, 6:56pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202 "2024-01-04T18:56:52Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\
**Post date:** [January 4, 2024, 6:56pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/1 "2024-01-04T18:56:52Z")

</div>

Hello guys,

I need some help with horizontal scroll.  
I want to hide the scrollbar that appears when I set the overflow property to “scroll”. However, when I hide it using CSS (overflow-x: hidden) it stops scrolling.

What am I missing?

Best

---

<div class="post-metadata">

**Author:** ![luka](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/luka/32/1571_2.png) [@luka](https://community.weweb.io/u/luka)\
**Post date:** [January 4, 2024, 8:45pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/2 "2024-01-04T20:45:24Z")

</div>

You hide the scrollbar with custom css property called -webkit-scrollbar

---

<div class="post-metadata">

**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\
**Post date:** [January 5, 2024, 6:07pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/3 "2024-01-05T18:07:33Z")

</div>

Hi Luka,

Thank you for your reply.  
I’m trying to use the CSS code but it is changing the whole element appearance and not just the scrollbar.

The overflow-y is working as expected but the webkit-scrollbar isn’t

![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/f/f6334a2010e260c42e73ba364bceb605eee81603.png)

---

<div class="post-metadata">

**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\
**Post date:** [January 10, 2024, 7:34pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/4 "2024-01-10T19:34:15Z")

</div>

Any help on this?

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [January 10, 2024, 8:29pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/5 "2024-01-10T20:29:40Z")

</div>

`webkit-scrollbar` is a pseudo-element, not a property. To add it you need to use a `style` tag with a selector targeting the right element. See the examples [here](https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-scrollbar)

---

<div class="post-metadata">

**Author:** ![HeFur](https://avatars.discourse-cdn.com/v4/letter/h/34f0e0/32.png) [@HeFur](https://community.weweb.io/u/HeFur)\
**Post date:** [January 11, 2024, 2:17pm UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/6 "2024-01-11T14:17:51Z")

</div>

I understood what you said but I have no idea how to do it in Weweb.  
Could you please elaborate a little more? I’m still new here…

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [January 12, 2024, 8:45am UTC](https://community.weweb.io/t/help-with-horizontal-scrolling/6202/7 "2024-01-12T08:45:35Z")

</div>

You want to add a html element with something like the examples of the linked page:

```auto
<style>
.mostly-customized-scrollbar::-webkit-scrollbar {
  width: 5px;
  height: 8px;
  background-color: #aaa; /* or add it to the track */
}
</style>

```

then you want to add the class to the relevant element. You may need to change the selector depending on what exact element you want to target. Opening the browser’s [dev tools](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Tools_and_setup/What_are_browser_developer_tools) and checking the structure of the page will help you with this.