It's not possible to have h1 and h2 in the same slide centered both

[ghost]

I can't get the h1 and h2 have both centered in slide:

Presentació de pares

30 d'octubre 2012

3r A

[marcstober]

It seems like it's designed for the first slide to have an H1 (centered horizonally and vertically) and nothing else, with other slides starting with H2. But this is neither obvious or documented for new users. I could hack the CSS to do something but it means overriding a number of different rules in the core css.

I'd expect it to be easier to add other text (for example, a name or date) to the title slide, and I'd expect it to be documented in the Getting Started or boilerplate.html that H1=main title slide; H2=additional slide.

Perhaps the vertical alignment could be a separate class that you can attach if you want, rather than hard-coded to H1.

[aadamovich]

I also ended up hacking around this with a custom (not very nice) CSS and different tags i.e. header and address.

deck.title.css:

.slide header {
  font-size: 4.5em;
  font-weight: bold;  
  text-align: center;
  padding-top: 3.5em;
  padding-bottom: 2em;
  max-height: 100%;
}

.slide address {
  font-size: 1.5em;
  font-style: italic;
  text-align: right;
  max-height: 100%;
}

boilerplate.hmtl:

...

    <link rel="stylesheet" href="extensions/title/deck.title.css">

...

  <section class="slide">
     <header>Presentation Title</header>
     <address class="author">By me</address>
     <address class="company">My Org</address>     
     <address><time>11-11-2011</time></address>
  </section>

But then I also needed to update theme CSS files to also include header and address tags in it. It would really be nice to have better support for "title" slides in core deck.js and themes.

[imakewebthings]

You're right that I haven't documented this properly, but there is a vcenter class for this.

<div class="slide">
  <div class="vcenter">
    <h1>Main Title</h1>
    <h2>Subtitle</h2>
    <p>And other things</p>
  </div>
</div>

The class lives here in core. I haven't documented it yet because I'm still up in the air about going in a couple directions when it comes to presentational styling classes like this. Sorry it's wasn't clear in the meantime. I'll leave this open until it's resolved either through documentation or a better replacement.

[aadamovich]

Thanks for the information, I'll try to change my code to use vcenter instead, but I'll keep an eye on this issue :)

[buchanae]

This also tripped me up. Furthermore, maybe it's better not to attach such a drastic style to the h1 tag directly.

For example, on a typical slide, h1 is more appropriate/proper for the heading at the top (which currently requires h2).

[treyhunner]

I just found this issue looking for the same thing. Thanks for making vcenter. 👍 for documenting it.

[imakewebthings]

Closing this in favor of #136. Will be making efforts to refactor core CSS to remove as much non-functional styling as possible and things like .vcenter will live in a component CSS library. This may be a ways out but that will be tracked in #136.