<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <ul class="list-group"> <li class="list-group-item">Sound1 <form class="form-inline pull-right vertical-align"> <span class="badge" style="margin-right: 10px;">0:58</span> <button class="btn btn-md btn-default" type="button"><span class="glyphicon glyphicon-play"></span></button> </form> </li> <li class="list-group-item">Sound2 <form class="form-inline pull-right vertical-align"> <span class="badge" style="margin-right: 10px;">0:15</span> <button class="btn btn-md btn-default" type="button"><span class="glyphicon glyphicon-play"></span></button> </form> </li> <li class="list-group-item">Sound3 <form class="form-inline pull-right vertical-align"> <span class="badge" style="margin-right: 10px;">0:07</span> <button class="btn btn-md btn-default" type="button"><span class="glyphicon glyphicon-play"></span></button> </form> </li> </ul> </div>

form { margin-top: -7px; }