<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="row"> <h2>Text Blocks Over Image</h2> <div class="image"> <img src="http://i.telegraph.co.uk/multimedia/archive/03397/Ski-Dubai-web_3397998b.jpg" alt="" /> <h2>A Movie in the Park:<br />Kung Fu Panda</h2> </div> </div> </div>

.image { position: relative; width: 300%; /* for IE 6 */ } h2 { position: absolute; top: 200px; left: 0; width: 100%; }