Html img响应引导3上的响应按钮

我试图在bootstrap3中使img上的文本响应。它不能正常工作，因为当我制作“绝对”css时，它不会响应。 如何使按钮始终在图像上显示并响应

一些HTML

        <div class="container">
            <div class="row">
                <div class=" col-md-12 col-sm-12 col-xs-12">
                    <div class=" col-md-6  col-sm-12 col-xs-12 ">
                        <img class="left img-responsive" src="http://placehold.it/350x250" alt="">
                        <div class="btn btn-danger button-image">
                            DOWNLOAD
                        </div>
                    </div>
                    <div class=" col-md-6  col-sm-12 col-xs-12 ">

                        <img class="left img-responsive" src="http://placehold.it/350x250" alt="">
                        <div class="btn btn-danger button-image">
                            SEE MORE
                        </div>

                    </div>

                </div>
          </div></div>


        <div id="push"></div>

下载
查看更多

靴子 从右向左更改：

.button-image{
position:absolute;
bottom:21px;
left: 130px;
width:100px;
height:30px;
}

您可能想考虑使用百分比将其定位在div中，但要考虑不同的视图端口大小等