<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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"> <div class="outer-wrapper"> <h1>Title</h1> <a href="#inside" class="inside-link">Inside link</a> <p> Seocnd inside link: <a href="#inside-second" class="inside-link">Click</a> </p> <a href="#outer" class="outer-link"></a> </div> </div> </div>

.outer-wrapper { position: relative; // mandatory display: block; width: 300px; height: 200px; padding: 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid gray; margin: 30px auto; background: #efefef; } .inside-link { z-index: 2; position: relative; } .outer-link { z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-indent: -9999px; overflow: hidden; }