title: Bootstrap 4 right to left custom file input
body: <p>i am trying to make the upload file input direction from bootstrap 4 right to left but nothing i tried so far worked </p>
  
  <p>i also tried to change the direction for different tags</p>
  
  <pre><code>&lt;div class="form-group"&gt;
          &lt;div class="col-md-4"&gt;
              &lt;div class="custom-file"&gt;
                  &lt;input type="file" class="custom-file-input" id="customFile" multiple lang="ar" dir="rtl"&gt;
                  &lt;label class="custom-file-label text-left" for="customFile"&gt;choose files to upload&lt;/label&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;script type="text/javascript"&gt;
              $('.custom-file input').change(function (e) {
                  var files = [];
                  for (var i = 0; i &lt; $(this)[0].files.length; i++) {
                      files.push($(this)[0].files[i].name);
                  }
                  $(this).next('.custom-file-label').html(files.join(', '));
              });
          &lt;/script&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/firCC.png" rel="noreferrer"><img src="https://i.stack.imgur.com/firCC.png" alt="bootstrap upload file control style"></a></p>