How do I change colors from the "file input button"?
This is what I have:
<div class="form-group">
<label for="exampleInputFile">File input</label>
<input type="file" id="exampleInputFile">
<p class="help-block">Example block-level help text here.</p>
</div>
And I tried the code below, but nothing happens:
#input[type=file]{
background: #000;
}
input{
background: #000;
}
How do I change the input file type color?
use this may help you
<div class="form-group">
<div class="fileUpload btn btn-primary">
<span>File input</span>
<input type="file" id="exampleInputFile" class="upload">
</div>
<p class="help-block">Example block-level help text here.</p>
</div>
and in style
<style>
.fileUpload {
position: relative;
overflow: hidden;
margin: 10px;
}
.fileUpload input.upload {
position: absolute;
top: 0;
right: 0;
margin: 0;
padding: 0;
font-size: 20px;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
}
</style>
You can try like this,
<style type="text/css">
.file-input{
display:none;
}
.file-lablel{
background: #d5d5d5;
border-radius: 5px;
padding: 5px;
}
<div class="form-group">
<input type="file" id="exampleInputFile" class="file-input">
<label for="exampleInputFile" class="file-lablel">File input</label>
<p class="help-block">Example block-level help text here.</p>
</div>
