Custom file LABEL text overlapping neighbouring HTML elements on Firefox #26933
Description
On Firefox 63 (but not on Chrome 70, Edge 44 nor Safari 12), the text in the "custom-file-label" LABEL element seems to invisibly overlap the neighbouring button INPUT element and prevents from clicking on it:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
</head>
<body>
<div class="form-row" style="width: 400px">
<div class="form-group col">
<div class="custom-file">
<input type="file" class="custom-file-input" id="browser">
<label class="custom-file-label" for="browser">long_filename.txt</label>
</div>
</div>
<div class="form-group col">
<input type="button" value="Load" class="btn btn-primary">
</div>
</div>
</body>
</html>
