Getting text to appear below a picture - html

Question

Hi guys so i am trying to get some text to appear below a picture i have using bootstrap version 3
So far i have :
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-3"><img alt="my image" class="img-about" src="Images/s1.fw.png"></div>
<div class="col-md-3">
<h2>aa</h2>
</div>
But so far its appearing side by side, but i would like it to appear below each other So the picture on the top and then text below e.g
Picture
-Text
Thanks

Answer 1

If you want your text to be underneath the image, don't put it in the separate column.
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-3">
<img alt="my image" class="img-about" src="Images/s1.fw.png"></div>
<h2>aa</h2>
<div class="col-md-3">
// Use this for seconfd image in the right of the 1st one.
</div>
</div>

Answer 2

If your looking for a different approach. More
p {
font-family: 'Noto Sans', sans-serif;
font-size: 1.1em;
line-height: 1.5em;
color: #666;
}
img {
max-width: 100%;
height: auto;
margin: 5px 0 50px;
}
.grid {
display: -webkit-flex;
display: flex;
}
.col {
padding: 30px;
}
.fluid-flex {
-webkit-flex: 1;
flex: 1;
/* Not supported by Safari */
}
<div class="grid">
<div class="col fluid-flex">
<h1>My Image 1</h1>
<img src="https://s.zkcdn.net/Advertisers/cd7db6dc529e4cd3a3b9483b34465631.png" alt="Image" title="Image" />
<p>This was taken when i was in TX.
</p>
</div>
<div class="col fluid-flex">
<h1>My Image 2</h1>
<img src="https://s.zkcdn.net/Advertisers/cd7db6dc529e4cd3a3b9483b34465631.png" alt="Image" title="Image" />
<p>This was taken when i was in CA.
</p>
</div>
<div class="col fluid-flex">
<h1>My Image 3</h1>
<img src="https://s.zkcdn.net/Advertisers/cd7db6dc529e4cd3a3b9483b34465631.png" alt="Image" title="Image" />
<p>This was taken when i was in NY.
</p>
</div>

Answer 3

Without bootstrap:
.wrapper {
width: 150px;
border:1px solid #ccc;
padding: 10px;
}
img {
width: 100%;
border: 1px solid #ccc;
padding: 2px;
}
h2 {
text-align: center;
}
<div class="wrapper">
<img alt="my image" class="img-about" src="http://justcuteanimals.com/wp-content/uploads/2016/10/baby-bear-pictures-cute-animal-pics.jpg">
<h2>Some Text</h2>
</div>