<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/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="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-md-offset-4"> <div class="card"> <div class="text-center"> <a href="#"><img src="http://bootsnipp.com/img/logo.jpg" class="img-circle"/></a> <h3 class="text-center">Bootsnipp User</h3> </div> <div class="tab-content"> <div class="tab-pane fade in active" id="home"> <p>Food truck fixie locavore, accusamus mcsweeney's marfa nulla</p> </div> <div class="tab-pane fade" id="profile"> <p>Reprehenderit butcher retro keffiyeh dreamcatcher synth.</p> </div> <div class="tab-pane fade" id="messages"> <p>Raw denim you probably haven't heard of them jean shorts Austin.</p> </div> </div> <ul class="nav nav-tabs nav-tab nav-justified" id="myTab"> <li class="active"><a class="tab-btn" href="#home" data-toggle="tab">asdf</a></li> <li><a class="tab-btn" href="#profile" data-toggle="tab">asdf</a></li> <li><a class="tab-btn" href="#messages" data-toggle="tab">asdf</a></li> </ul> </div> </div> </div> </div>

body{padding-top:30px;} .card { -moz-box-shadow: 0 0 2px #888; -webkit-box-shadow: 0 0 2px#888; box-shadow: 0 0 2px #888; } .card img { width: 80px; height: 80px; margin-top:30px; } .card li a{ } .nav-tabs>li>a { border: none; }