Bootstrap input file button (Credit: http://www.abeautifulsite.net/whipping-file-inputs-into-shape-with-bootstrap-3/)

btn-file.css

.btn-file {
    position: relative;
    overflow: hidden;
}

.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}

btn-file.html

<span class="btn btn-default btn-file">
    Browse <input type="file">
</span>

btn-file.js

$(document).on('change', '.btn-file :file', function() {
    var input = $(this),
        numFiles = input.get(0).files ? input.get(0).files.length : 1,
        label = input.val().replace(/\\/g, '/').replace(/.*\//, '');
    input.trigger('fileselect', [numFiles, label]);
});

// Event handler
$(document).on('fileselect', '.btn-file :file', function(event, numFiles, label) {
    var $this = $(this),
        $label = $($this.data('label'));

    if ($label.length) {
        $label.append(label);
    }
});