# How to hide scrollbars in extensions?

**URL:** <https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680>\
**Category:** Extensions\
**Created:** [February 8, 2022, 9:37am UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680 "2022-02-08T09:37:10Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![tejendrapratap12](https://avatars.discourse-cdn.com/v4/letter/t/cab0a1/32.png) [@tejendrapratap12](https://discuss.dev.twitch.com/u/tejendrapratap12)\
**Post date:** [February 8, 2022, 9:37am UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680/1 "2022-02-08T09:37:10Z")

</div>

I already tried using the CSS, overflow: hidden property but it didn’t work.  
The scrollbars appear when the height or width exceed 280px and 300px respectively.

Need help regarding this.

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [February 8, 2022, 12:17pm UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680/2 "2022-02-08T12:17:59Z")

</div>

You probably need to add some positioning or a reset set of rules or something else to get the CSS to achieve what you want.

In this example you added overflow: hidden to the wrong element.

There are a number of solutions to this but it’s just a CSS issue with getting content into a fixed size div. There is no one answer. And theres not enough information to make a suggestion

Personally I tend to apply a reset.css then add a div to body and on that div apply the CSS Rules I need/want for the intended outcome.

Something along the lines of

```css
#id_of_the_div {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow: hidden;
}

```

---

<div class="post-metadata">

**Author:** ![tejendrapratap12](https://avatars.discourse-cdn.com/v4/letter/t/cab0a1/32.png) [@tejendrapratap12](https://discuss.dev.twitch.com/u/tejendrapratap12)\
**Post date:** [February 11, 2022, 8:37am UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680/4 "2022-02-11T08:37:56Z")

</div>

I tried this and it didn’t work.  
The issue is not just addition of scrollbars, if I want to make my extension smaller in height than 380px, it still is taking up that much space and white space is added in between the extension and the extension name.

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [February 11, 2022, 12:28pm UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680/5 "2022-02-11T12:28:16Z")

</div>

I can’t debug what I can’t see.

Somewhere you have a CSS problem. But I don’t know what you are doing to see what a fix could be.

---

<div class="post-metadata">

**Author:** ![tejendrapratap12](https://avatars.discourse-cdn.com/v4/letter/t/cab0a1/32.png) [@tejendrapratap12](https://discuss.dev.twitch.com/u/tejendrapratap12)\
**Post date:** [February 16, 2022, 8:40am UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680/6 "2022-02-16T08:40:20Z")

</div>

Thanks for your Help @BarryCarlyon. I missed out on Panel Height inside of Asset Hosting in the extensions manager console. From there we can define the height of the extension between 100-500px. 300px is the default value.

---

<div class="post-metadata">

**Author:** ![BarryCarlyon](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/barrycarlyon/32/253_2.png) [@BarryCarlyon](https://discuss.dev.twitch.com/u/BarryCarlyon)\
**Post date:** [February 16, 2022, 12:28pm UTC](https://discuss.dev.twitch.com/t/how-to-hide-scrollbars-in-extensions/36680/7 "2022-02-16T12:28:26Z")

</div>

Good to here.

You’ll still need to do CSS for scroll bars if your content is taller than 500px!