Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Style input type="file" in Webkit (Chrome, Safari)
input[type=file] {
position: relative;
-webkit-appearance: textfield;
-webkit-box-sizing: border-box;
}
input[type=file]::-webkit-file-upload-button {
border: none;
margin: 0;
padding: 0;
-webkit-appearance: none;
width: 0;
}
/* "x::-webkit-file-upload-button" forces the rules to only apply to browsers that support this pseudo-element */
x::-webkit-file-upload-button, input[type=file]:after {
content: 'Browse...';
display: inline-block;
left: 100%;
margin-left:3px;
padding: 3px 8px 2px;
position: relative;
-webkit-appearance: button;
}
@RA344710

This comment has been minimized.

Copy link

@RA344710 RA344710 commented Jan 8, 2018

how to use -webkit-file-upload-button CSS in safari?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.