Skip to content

Instantly share code, notes, and snippets.

@snowman-repos
Created October 2, 2012 05:05
Show Gist options
  • Save snowman-repos/3816272 to your computer and use it in GitHub Desktop.
Save snowman-repos/3816272 to your computer and use it in GitHub Desktop.
CSS: Webkit File Upload Button to the Right
/*
Firefox and IE have the "choose file" button to the right of the
filepath, while Webkit puts it on the left. This makes WebKit put
it on the right as well.
*/
<input type="file">
input[type="file"]{
-webkit-appearance: none;
-webkit-rtl-ordering: left;
text-align: left;
}
input[type="file"]::-webkit-file-upload-button{
-webkit-appearance: none;
background-image: -webkit-gradient(linear, left bottom, left top, from(#d2d0d0), to(#f0f0f0));
background-image: -moz-linear-gradient(90deg, #d2d0d0 0%, #f0f0f0 100%);
border: 1px solid #aaaaaa;
border-radius: 4px;
float: right;
margin: 0 0 0 10px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment