使堆叠的div响应另一个带图像的div的问题

Question

所以我需要达到这个效果。

我正在使用bootstrap

https://gyazo.com/089764ced3250e52c184b16f991214e0

这是我的初始代码，但我不知道如何定位它，我已经尝试了所有内容，但它仍然没有响应窗口。我最好能做到这一点，谢谢:)。

        <div class="row" id="banner-top-row">
            <div class="col-md-12" id="banner-top-col">
            <img src="img/banner-top.png" id="banner-top" class="img-responsive"/>
                <div class="banner-information">
                    <h4> For More Information.... </h4>
                    <h1> Contact Us </h1>
                </div>
            </div>
        </div>

Answer 1

虽然我无法得到你想要的东西但是如果我做对了你希望你的形象和内容在中心，而不会影响响应式设计。 如果这段代码可以帮助您，请查看它

http://jsbin.com/binusu/edit?html,css,output