<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.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="jumbotron"> <!-- <div class="container"> --> <div class="row"> <div class="col-md-12 col-xs-12"> <div class="vid"> <iframe width="560" height="315" src="https://www.youtube.com/embed/ac7KhViaVqc" allowfullscreen=""></iframe> </div><!--./vid --> </div><!--.col --> </div><!--./row --> <!-- </div> --><!--./container --> </div>

.vid { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .vid iframe, .vid object, .vid embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-right: 0px; padding-left: 0px; }