To Go Fullscreen! (For real)&lt;/button&gt; Step 3: Resize Your Elements You may have noticed on some browsers (Opera and Chrome) that when you clicked on the fullscreen button that the video player was centered in the middle of a big black screen. That's because by default, fullscreen mode doesn't resize your elements for you. Luckily, there's a simple bit of CSS which will allow you to specify how you want your elements to appear in fullscreen mode. It's called something different in each browser, but in Chrome, it's a CSS pseudo-class called :-webkit-full-screen . In Firefox, it's called :-moz-full-screen . We want our player example to strech all the way across the screen, so that's what we'll do. Fullsceen and &lt;iframe&gt; - a technical note While you can take pretty much any element and take it to fullscreen mode, &lt;iframe&gt; elements are a bit trickier. You'll need to set the "allowFullScreen" property on the tag itself, which allows the contents to be taken into fullscreen mode. Where Do We Go From Here? You can make all sorts of changes to your fullscreen elements once you're in fullscreen mode, either using CSS or using some more in-depth JavaScript code. For example, if you had a text overlay that you wanted to make visile in fullscreen mode, you could show it using the -full-screen CSS pseudo class (remember, you need to replicate this property for each browser). The rest is up to your imagination! Comments Is there a timeline for when this