стиль типа ввода = "файл"

Question

Я пытаюсь выровнять текст так же, как и кнопка выбора файла.

input[type='file'] { 
    background: #000; 
    border-radius: 5px; 
    color: #fff; 
    font-family: "Marmellata", sans-serif; 
    padding: 6px 10px 14px 17px; 
    font-size: 20px; 
    margin-bottom: 20px; 
    width: 240px; 
    vertical-align: top; 
    margin-top: 0px; 
} 

<input name="t1" class="imgupload" type="file" accept="image/*" capture="camera"> 

EDIT:

меня решить эту проблему с помощью этого метода:

.select-image-btn input[type=file] { 
     font-size: 100px; 
     position: absolute; 
     left: 0; 
     top: 0; 
     opacity: 0; 
     } 

.select-image-btn { 
     position: relative; 
     overflow: hidden; 
     display: inline-block; 
     } 

Просто добавьте имя класса на

ввода [тип = файл]

DIV должен быть, как этот

<div class="select-image-btn"> 
     <button class="btn default" >Upload a file</button> 
     <input type="file" name="t1" accept="image/*" capture="camera"> 
</div> 

Answer 1

почему вы не использовать следующие?

input.imgupload { 
background: #000; 
border-radius: 5px; 
color: #fff; 
font-family: "Marmellata", sans-serif; 
padding: 6px 10px 14px 17px; 
font-size: 20px; 
margin-bottom: 20px; 
width: 240px 
vertical-align: top; 
margin-top: 0px; 
} 

В любом случае класс имеет более сильный вес, чем селектор атрибутов.