title: text-align beneath multiple images
body: <p>I have four images that are horizontally placed next to each other. I am trying to put text beneath each of those images. This is what I have right now.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="team"&gt;
  &lt;h3&gt;Our Team&lt;/h3&gt;
  &lt;img src="image.jpg" width="200px" height="200px" hspace="20" /&gt; &lt;h3&gt;John Doe&lt;/h3&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;img src="image.jpg" width="200px" height="200px" hspace="20" /&gt; &lt;h3&gt;John Doe&lt;/h3&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;img src="image.jpg" width="200px" height="200px" hspace="20" /&gt; &lt;h3&gt;John Doe&lt;/h3&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;img src="image.jpg" width="200px" height="200px" hspace="20" /&gt; &lt;h3&gt;John Doe&lt;/h3&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;p&gt;Text&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <blockquote>
    <p>.team {
        display: block;
        float:bottom;
        padding: 10px;
        margin: 15px;
    }</p>
  </blockquote>