Тип ввода типа = файл не работает как ожидалось

Question

Я создаю шаблон css для типов форм и хочу, чтобы форма вводила закругленную границу. Это хорошо работает с типом = текст, но не работает с типом = file (для загрузки файла).

Что я делаю неправильно?

.tempform input[type="text"] { 
    -moz-border-radius: 10px; 
} 

.tempform input[type="file"] { 
    -moz-border-radius: 10px; 
} 

<div class="tempform"> 
    <label for="textfield">Test Text Field</label> 
    <input type="text" id="textfield" name="textfield"></div> 
</div> 

div class="tempform"> 
    <label for="filefield">Test File Field</label> 
    <input type="file" name="filefield" id="filefield-0"> 
    <input type="file" name="filefield" id="filefield-1"> 
</div> 

Answer 1

К сожалению, невозможно создать стиль ввода файлов, кроме того, чтобы немного изменить ширину. Браузеры просто не разрешают никаких других изменений. Если вы хотите стилизовать входной файл для загрузки файлов, вам придется использовать неприятный взломать, например, разместить почти невидимый вход для загрузки файлов поверх изображения (который работает только в некоторых браузерах) или с помощью JavaScript-решения, такого как ajax-upload.

Answer 2

Согласно the first Google search result, это скорее вовлечен. См. this article на quirksmode.org для получения информации о том, как это сделать.