JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<div  style="position:relative; text-align:center;margin-top: 10px; padding-right: 0px; padding-left: 0px;" class="col-sm-6 col-md-6 col-lg-4 text-center ">
            <a class="ShowHidden" href="#">
                <div>
                    <img style="width:100% ; height:auto;" class="img-responsive center-block" src="http://media02.hongkiat.com/ww-flower-wallpapers/roundflower.jpg" />
                    <span class="imagegood">GoodTitle</span>
                </div>
                

            </a>
                <h3 style="font-weight:bold;" class="h">GoodTitle</h3>
            <h5 class="h">GoodSubText</h5>
        </div>

CSS

.imagegood{
    position: absolute;
    top: 200px;
    background-color:white;
    color:black;
    padding:10px;
    font-size:large;
    display:none;
}
.ShowHidden:hover span{
    display:block !important;
}