CODEWITHSUNDEEP
cssbootstrap-4
Kavitha K
Kavitha K

Reputation: 75

How to make css for input type file

Trying to make css for input type file but not working.In my code choose file button is coming above of button css So how to remove using css?

I want to show only blue color button with file upload process

Demo: https://stackblitz.com/edit/angular6-bootstrap4-navbar-8hr7um?file=src/app/app.component.html

<input #file type="file" id="fileInput" accept='image/*' (change)="preview(file.files)" class="btn btn-primary btn-block mx-auto" value="UPLOAD IMAGE" />

Upvotes: 0

Views: 223

Answers (2)

jaibalaji
jaibalaji

Reputation: 3475

use below html(assuming you are using bootstrap)

<label class="btn btn-primary"> Browse <input type="file" style="display: none;"> </label>

Upvotes: 1

Charlotte_Anne
Charlotte_Anne

Reputation: 382

I think you are using Bootstrap's documentation for buttons, but what would work best for you is Bootstrap's documentation for input groups. Check out the second to last category on this page: https://getbootstrap.com/docs/4.5/components/input-group/. It's titled 'Custom file input.' I think if you put your style into these it would work.

Upvotes: 0

Related Questions