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

css reveal.js
Amanda picture Amanda · Mar 17, 2014 · Viewed 12.3k times · Source

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

riezebosch picture riezebosch · Oct 9, 2014

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; }

Related questions

How to use two-column layout with reveal.js?

I use reveal.js and write my slides in Markdown code. Now I want to display my content (text, unordered list of bullet points or even an image) in a classical two-column text layout. I would prefer a solution which …

Read More
How does reveal.js resize elements?

I am trying to understand how reveal.js resizes elements dynamically. To see this, adjust the height of the page and see how elements (to a certain degree) shrink as the page shrinks. However, using chrome inspector, I cannot see …

Read More
Set header and footer reveal.js presentation

I want to set a header and footer in my presentation. I used the following issue as a starting point: https://github.com/hakimel/reveal.js/issues/806 and http://www.ciges.net/revealjs_demo/#/ My current implementation gives the following …

Read More