JSFiddle - React, Tailwind, and code Playground

by BYossarian

HTML

<div class="uploadWrapper">
    <p>Click to choose file</p>
    <input type="file" name="filedata" size="100" />
</div>

CSS

.uploadWrapper {
    overflow: hidden;
    position: relative;
    height: 25px;
    width: 250px;
    background: rgb(10, 100, 210);
}
.uploadWrapper input {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
}
.uploadWrapper p {
    margin: 0 10px;
    position: absolute;
    line-height: 25px;
}