title: displaying 3 images in a row with text underneath in bootstrap
body: <p>I am trying to display 3 images in a row with a title, some text underneath the title and a button. I have tried doing this in bootstrap only to get the text moving all over the place. This seems like the only way I could get the text to stay put, but now as you can see my images are stacked on top of each other rather than next to each other. Any help would be appreciated!</p>
  
  <pre><code> &lt;section class="part2"&gt;
          &lt;div class="container"&gt;
              &lt;div class="row"&gt;
              &lt;div class="text-center"&gt;
                  &lt;img alt="" class="resize-image" id="image1" src="/wp-content/themes/creativeforces/images/kid2.jpg"&gt; 
                  &lt;p&gt;Teach&lt;/p&gt;
                  &lt;img alt="" class="resize-image" id="image2" src="/wp-content/themes/creativeforces/images/kid2.jpg"&gt;
                  &lt;p&gt;Read&lt;/p&gt;
                   &lt;img alt="" class="resize-image" id="image3" src="/wp-content/themes/creativeforces/images/kid2.jpg"&gt;
                  &lt;p&gt;Play&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>this is what it looks like now
  <a href="https://i.stack.imgur.com/b2Gn9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/b2Gn9.png" alt="enter image description here"></a></p>
  
  <p>i am trying to get it to look something like this
  <a href="https://i.stack.imgur.com/jRINF.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jRINF.png" alt="enter image description here"></a></p>