title: How do I vertically center an H1 in a div?
body: <p>First of all, my apologies. I know there are various solutions posted for this issue here, but for the life of me I can't get any of them to work. </p>
  
  <p>For a responsive website I'm trying to center an h1 in a div. </p>
  
  <p>Centering horizontally is not an issue, but I'm having problems getting it centered vertically. Presumably I'm doing something wrong or misunderstanding the explanations I found here (or maybe both).</p>
  
  <p>So as I'm probably interpreting earlier solutions given the wrong way, could someone please explain what exactly I have to add to the code beneath to get the h1 to center vertically? </p>
  
  <p>(To make this question relevant to as much people as possible, I've already stripped the code of all my previous attempts to do so myself.) </p>
  
  <p>CSS: </p>
  
  <pre><code>html, body {
  height: 100%;
  margin: 0;
  }
  
  #section1 {
  min-height: 90%; 
  text-align:center
  }
  </code></pre>
  
  <p>HTML:  </p>
  
  <pre><code>&lt;div class="section" id="section1"&gt;
  &lt;h1&gt;Lorem ipsum&lt;/h1&gt;
  &lt;/div&gt; 
  </code></pre>