Bootsrtap Drop Down (Navin Comobo)

by Pratik Bhoir

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://silviomoreto.github.io/bootstrap-select/javascripts/bootstrap-select.js"></script>
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen" href="http://silviomoreto.github.io/bootstrap-select/stylesheets/bootstrap-select.css">

<div style="margin:100px;">
    <select class="selectpicker" data-size="3">
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option >Ketchup</option>
        <option>Relish</option>
        <option>Mustard</option>
        <option>Ketchup</option>
        <option>Relish</option>
    </select>
</div>

CSS

.bootstrap-select.btn-group .dropdown-menu {
    min-width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    top: -100%;
}

JavaScript

$('.selectpicker').selectpicker();