title: Image and text side by side and centered?
body: <p>I can not figure out how to get the title and subtitle to appear after the knight on the same line. Any help? I've tried div and tables too. It just refuses to be next to each other and centered.</p>
  
  <p><a href="http://universitychessclub.org/gg.html" rel="nofollow">Chess Page</a></p>
  
  <p>The Full Code
  </p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=windows-1252"&gt;
  &lt;title&gt;University Chess Club&lt;/title&gt;
  
  &lt;/head&gt;
  &lt;style&gt;
  body {
      background-image: url("ChessBackground.jpg");
      background-repeat: no-repeat;
      background-size : cover;
  }
  h1{
  /*margin-left:23%;*/
  font-size:350%;
  color: #f2f0ea;/* --off- yellow-white-- */
  margin-bottom:5px;
  font-family: 'Voltaire', sans-serif;
  }
  
  h2{
  margin-left:35%;
  width:50%;
  margin-top:0%;
  color: #f2f0ea;/* --off- yellow-white-- */
  font-family: 'Voltaire', sans-serif;
  }
  
  .group:before,
  .group:after {
  overflow: auto;
    content: "";
    display: table;
  }
  .group:after {
  overflow: auto;
    clear: both;
  }
  .group {
  overflow: auto;
    *zoom: 1;
  }
  .box-set {
    overflow: auto;
  }
  &lt;/style&gt;
  
  &lt;body&gt;
  &lt;div class="box-set"&gt;
    &lt;figure class="box"&gt;&lt;img src="header.png" alt="Header" height=35% width=35%&gt;&lt;/figure&gt;
  &lt;figure class="box"&gt;&lt;h1&gt;University Chess Club&lt;/h1&gt;&lt;h2&gt;At The University Of Utah&lt;/h2&gt;&lt;/figure&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>