# Inconsistent panel sizes?

**URL:** <https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918>\
**Category:** Extensions\
**Created:** [February 7, 2019, 1:10am UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918 "2019-02-07T01:10:58Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![gravenimagerd](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/gravenimagerd/32/5715_2.png) [@gravenimagerd](https://discuss.dev.twitch.com/u/gravenimagerd)\
**Post date:** [February 7, 2019, 1:10am UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918/1 "2019-02-07T01:10:58Z")

</div>

I released an extension today to the public that was displaying fine in dev rig, in browser preview, and when I previewed it on my stream in hosted mode, as well as live on my Twitch channel right now.

![image](https://d2opxh93rbxzdn.cloudfront.net/original/2X/7/771ad7dc306af5afffc4b0e62368c0f9edbc9098.jpeg)

However on a friend’s channel, it looks like this…  
 ![image](https://d2opxh93rbxzdn.cloudfront.net/original/2X/9/906ef6289b4e5e03befaccbfa82b0a70944f83e3.png)

Specifically the issue is that the vertical scroll bar kicks in which in turn causes several elements to pop under. If I inspect the version on my channel it immediately breaks and looks like the second image as well. I couldn’t find any specific guidance on a target width for extensions so I went off of what looked safe in testing. Is there a target width I should never go over? Is there a reason for the inconsistency between the dev rig and the live experience?

---

<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 7, 2019, 10:06am UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918/2 "2019-02-07T10:06:45Z")

</div>

The internal width dimension of an panel extension is 318px.

Inside that you need to take into account for a scrollbar if you need a scrollbar. Easiest methods is to support a flexible width design, since the extension can look wildly different if a user “pops out” the extension.

I’m sure the docs had some notes in the docs on dimensions but I can’t find them

---

<div class="post-metadata">

**Author:** ![Breci](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/breci/32/5635_2.png) [@Breci](https://discuss.dev.twitch.com/u/Breci)\
**Post date:** [February 7, 2019, 2:04pm UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918/3 "2019-02-07T14:04:04Z")

</div>

The dimensions information are on the design part of the doc: [https://dev.twitch.tv/docs/extensions/designing/#panel-extensions](https://dev.twitch.tv/docs/extensions/designing/#panel-extensions)

---

<div class="post-metadata">

**Author:** ![gravenimagerd](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/gravenimagerd/32/5715_2.png) [@gravenimagerd](https://discuss.dev.twitch.com/u/gravenimagerd)\
**Post date:** [February 7, 2019, 4:10pm UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918/4 "2019-02-07T16:10:17Z")

</div>

The 318px width makes sense. Looking at the structure of the view in the dev rig it looks the difference stems from the dev rig not having a containing div that sets a 1px border. On my channel when I inspect the panel there is this:

`<div class="tw-border-l tw-border-r tw-border-t">...</div>`

But no equivalent div in the dev rig. Seems like that should probably be corrected to give the best experience in the dev rig. Either the div.view should be set to 318px or there should be a div with a 1px border to give the most accurate preview of what it’ll look like on live.

---

<div class="post-metadata">

**Author:** ![Diogee](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/diogee/32/6315_2.png) [@Diogee](https://discuss.dev.twitch.com/u/Diogee)\
**Post date:** [February 19, 2019, 8:24pm UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918/5 "2019-02-19T20:24:56Z")

</div>

Thanks for the feedback - we’re going to update the dev rig to provide a more consistent experience with how Extension panels work on a live Twitch channel.

---

<div class="post-metadata">

**Author:** ![cidzerda](https://d3ovvz0v2ajtpu.cloudfront.net/user_avatar/discuss.dev.twitch.com/cidzerda/32/4589_2.png) [@cidzerda](https://discuss.dev.twitch.com/u/cidzerda)\
**Post date:** [February 20, 2019, 12:31am UTC](https://discuss.dev.twitch.com/t/inconsistent-panel-sizes/19918/6 "2019-02-20T00:31:12Z")

</div>

I have updated the Developer Rig so it now has the one-pixel border.
