Johann-S / bs-custom-file-input

A little plugin for Bootstrap 4 custom file input
https://bs-custom-file-input.netlify.com/
MIT License
210 stars 39 forks source link

Label text overflows when uploading multiple files in iOS Safari #75

Closed alstr closed 4 years ago

alstr commented 4 years ago

I noticed when doing some testing that when using iOS Safari, if you upload multiple image files (which have pretty long names when stored in Photos), the text overflows the label and isn't hidden.

I propose something like:

.custom-file-label {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    padding-right: 25%;
}

The padding is optional but I think it looks better truncated with an ellipsis. This was the easiest way to achieve that.

Johann-S commented 4 years ago

Hi @alstr

bs-custom-file-input is just a JavaScript lib, for CSS changes please open an issue on Bootstrap