htmlinternationalizationdialog

Labeling file upload button

How can I internationalize the button text of the file picker? For example, what this code presents to the user:

     <input type="file" />

In English in my browser, the button says "Browse..." and the label says "No file selected.". How do I make the browser use a different language?

Solution

  • Pure CSS solution:

    .inputfile {
  /* visibility: hidden etc. wont work */
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}
.inputfile:focus + label {
  /* keyboard navigation */
  outline: 1px dotted #000;
  outline: -webkit-focus-ring-color auto 5px;
}
.inputfile + label * {
  pointer-events: none;
}
    <input type="file" name="file" id="file" class="inputfile">
<label for="file">Choose a file (Click me)</label>

    source: http://tympanus.net/codrops