<div class="custom-file-input"> <input type="file" class="custom-file-input_input"> </div>
.custom-file-input { padding: 10px; border-radius: 2px; position: relative; border: 1px solid #ccc; overflow: hidden; &_input { color: #999; width: calc(100% + 95px); text-align: left; margin-left: -95px; &::-webkit-file-upload-button { visibility: hidden; position: relative; } &::before { content: '+'; color: #999; display: inline-block; background: #eee; border: 1px solid #ccc; border-radius: 3px; padding: 5px 8px; outline: none; white-space: nowrap; position: absolute; top: 5px; right: 5px; -webkit-user-select: none; cursor: pointer; font-weight: 700; font-size: 14px; } &:hover { &::before { border-color: black; } } &:active { &:hover { background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9); } } } }