Grokking CSS Design Patterns to Ace Interviews/

...

/

Problem: Custom File Upload Button

Problem: Custom File Upload Button

Try to create a custom file upload button by hiding the native input and styling a visible span with hover effects using only CSS.

We'll cover the following...

Problem description

Given an HTML page containing a label with the class .custom-file that wraps a file input and a span element with the class .button-text displaying “Choose File,’’ write CSS to:

  • Hide the native file input element. ...