title: custom-file-input label not shown in bootstrap 4
body: <p>I am trying to display a label above a custom file input field and another label inside it with bootstrap 4. I tried the following, but the <code>label 1</code> is not shown.</p>
  
  <pre><code>&lt;label class="w-100"&gt;label 1
    &lt;input type="file" class="custom-file-input"&gt;
    &lt;label class="custom-file-label"&gt;label 2&lt;/label&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p>When I label a normal input field this way, <code>label 3</code> is shown as expected.</p>
  
  <pre><code>&lt;label class="w-100"&gt;label 3
    &lt;input type="text" class="form-control"&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p>Does anybody know why <code>label 1</code> is not shown and what I should do to display <code>label 1</code> and <code>label 2</code>? Many thanks in advance.</p>
  
  <p>What actually does work is this:</p>
  
  <pre><code>&lt;label for="some-id" class="w-100"&gt;label 1&lt;/label&gt;
  &lt;div class="custom-file" style="margin-top:-1.5em" id="some-id"&gt;
    &lt;input type="file" class="custom-file-input"&gt;
    &lt;label class="custom-file-label"&gt;label 2&lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>but the negative margin seems to be a bad solution. Without it, the label is displayed to high.</p>