SASS 3.2 HTML5 Fullscreen Support

fullscreen.scss

@mixin fullscreen() {
  &:-webkit-full-screen {
    @content;
  }
  &:-mozilla-full-screen {
    @content;
  }
  &:full-screen {
    @content;
  }
}

@include fullscreen() {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}

I wasn't able to list the pseudo selector using comma (same as https://stackoverflow.com/questions/47444344/prefixed-fullscreen-psuedo-selector-on-firefox) but using a mixin is definitely a great idea which solves the issue nicely, thx @cjcheshire!

Regarding your above solution I have modified the mixin like the following:

@mixin fullscreen() {
  &:-moz-full-screen {
    @content;
  }

  &:-webkit-full-screen {
    @content;
  }

  &:-ms-fullscreen {
    @content;
  }

  &:fullscreen {
    @content;
  }
}