Custom style of browse file using css

//css

.lbl

        {

            position: relative;

            border: 1px solid #adadad;

            text-align: center;

            cursor: pointer;

            color: #333;

            background-color: #e6e6e6;

            border-radius: 4px;

        }

        .lbl input

        {

            position: absolute;

            z-index: 2;

            opacity: 0;

            width: 100%;

            height: 100%;

            cursor: pointer;

            /*margin-top: -22px;*/

        }      

.lbl:hover {

    background: #CCCCCC;

}

.lbl:active {

    background: #CCFFCC;

}

// Html

<div class="lbl">

    <input type="file"/>

    <span>Browse..</span>

</div>

//Result

Browse..