title: Applying CSS to HTML5 Fullscreen API?
body: <p>I am trying <a href="http://johndyer.name/lab/fullscreenapi/" rel="nofollow">this example</a> for the full-screen API. Is it possible to apply CSS to the full screen element (eg. <code>"#box"</code>)? For example I want to display some text in the full-screen, so I would like to have its width 80% of the screen and add some padding there.
  Also, is it possible to style an element only when it is in the full-screen mode? Thanks.
  I have tried this:</p>
  
  <pre><code>#box:-webkit-full-screen {
      width: 50%;
      height: 50%;
      background: #FFFFFF !important;
    }
    #box:-moz-full-screen {
      width: 50%;
      height: 50%;
      background: #FFFFFF !important;
    }
  </code></pre>
  
  <p>This works on chrome, but Firefox ignores the width.</p>