# Help enabling Full Screen button on embedded (iframe) stream

**URL:** <https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113>\
**Category:** Help / Off-topic\
**Created:** [November 14, 2016, 6:03pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113 "2016-11-14T18:03:58Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![sonnyonfire](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/sonnyonfire/32/2199_2.png) [@sonnyonfire](https://staging-discuss.dev.twitch.com/u/sonnyonfire)\
**Post date:** [November 14, 2016, 6:03pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113/1 "2016-11-14T18:03:58Z")

</div>

I’m having an issue getting a stream to go full screen on my site. I’m hosting a private page at [sclisi.com/db](http://sclisi.com/db) and the embedded Twitch frame has the Full Screen button disabled. I’ve tried adding allowfullscreen to the iframe item but I can’t get the button to enable. The old Twitch player worked fine (last used a year ago) and allowed for full screen, but this new player doesn’t. Can someone take a look at the page, and does anyone have any ideas?

Also, the page is designed as a dashboard for Desert Bus for Hope. If you’re not familiar, it’s an incredible charity event and you should check it out!

---

<div class="post-metadata">

**Author:** ![DallasNChains](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/dallasnchains/32/1608_2.png) [@DallasNChains](https://staging-discuss.dev.twitch.com/u/DallasNChains)\
**Post date:** [November 14, 2016, 11:01pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113/2 "2016-11-14T23:01:33Z")

</div>

Try taking the embed out of a `frame` element. If you load the `drivercam.html` file directly, the fullscreen button is enabled. The frame element is [obsoleted in HTML5](https://www.w3.org/TR/html5-diff/#obsolete-elements).

---

<div class="post-metadata">

**Author:** ![sonnyonfire](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/sonnyonfire/32/2199_2.png) [@sonnyonfire](https://staging-discuss.dev.twitch.com/u/sonnyonfire)\
**Post date:** [November 14, 2016, 11:29pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113/3 "2016-11-14T23:29:55Z")

</div>

Thanks! I use the frames so my users can resize the different sections for their different display and browser sizes. Is there an alternative to frames that’s easy to set up and will give me the same functionality? I don’t need a walkthrough, but this stuff is new to me and I could use a push in the right direction. Thanks again.

---

<div class="post-metadata">

**Author:** ![DallasNChains](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/dallasnchains/32/1608_2.png) [@DallasNChains](https://staging-discuss.dev.twitch.com/u/DallasNChains)\
**Post date:** [November 15, 2016, 3:43pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113/4 "2016-11-15T15:43:06Z")

</div>

The easiest way would be the CSS `resize` property. There are a few caveats to using it (especially regarding `overflow`), but it should work similarly. 🙂

---

<div class="post-metadata">

**Author:** ![sonnyonfire](https://d1d6mrmdu7ztse.cloudfront.net/user_avatar/staging-discuss.dev.twitch.com/sonnyonfire/32/2199_2.png) [@sonnyonfire](https://staging-discuss.dev.twitch.com/u/sonnyonfire)\
**Post date:** [November 15, 2016, 11:26pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113/5 "2016-11-15T23:26:53Z")

</div>

That helps! I’m fairly new to CSS, I’ll see what I can come up with. Thanks.

---

<div class="post-metadata">

**Author:** ![system](https://d2spem0quai2ol.cloudfront.net/original/2X/0/05909729875cce3b53e59d5561c4d23bb14948fc.png) [@system](https://staging-discuss.dev.twitch.com/u/system)\
**Post date:** [November 25, 2016, 11:26pm UTC](https://staging-discuss.dev.twitch.com/t/help-enabling-full-screen-button-on-embedded-iframe-stream/8113/6 "2016-11-25T23:26:52Z")

</div>

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.
