Can I align reveal.js slides to the top of the page?

Question

I'm using reveal.js and trying to sort out how to force my slides to the top left-most corner of the page. That seems like it should be straightforward, but when I use the Element inspector it so radically changes the page that I can't even begin to zero in on how to move the slides up to the top.

Adding this to my theme:

.reveal .slides>section,
.reveal .slides>section>section {
    padding: 0;}

Bumped it up a smidge (reveal.css has the padding set to 20px 0) but there's still white space at the top of each slide.

Answer 1

To move your slides to the top is just a configuration option of reveal.js.

Reveal.initialize({
    center: false
}

I haven't figured it out how to move them to the left though.

Horizontal alignment can be done from CSS:

.reveal .slides { margin: 0; }

Answer 2

You can used fixed positioning if you want the slides to stay in the same place as you scroll. But if you want them to stay at the top you need to use absolute positioning.

.slides {
    position: absolute;
    top: 0;
    left: 0;
}

This will set the div at the 0th pixel from the top and the 0th pixel from the left. Obviously, if you want some separation you can change these numbers.