使用Bootstrap 3在Firefox中使用文件上载可点击区域的问题

Question

我正在使用基于Bootstrap 3的模板，Firefox的文件输入元素存在一个奇怪的显示问题：基本上点击区域覆盖了页面的大部分，这意味着在没有触发的情况下无法点击它们周围的任何内容文件上传。

这就是我所说的大区域（使用Firebug，基于<input type="file">元素）：

使用Chrome时，它很好：

使用IE浏览器也没关系。

以下是您看到问题的主题页面的链接（仅发生在第一种类型的“高级文件输入”，其中显示了输入元素）：http://www.keenthemes.com/preview/metronic_admin/components_form_tools.html

以下是文件显示的代码：

<div class="fileinput fileinput-new" data-provides="fileinput">
    <div class="input-group input-large">
        <div class="form-control uneditable-input span3" data-trigger="fileinput">
            <i class="fa fa-file fileinput-exists"></i>&nbsp;
            <span class="fileinput-filename"></span>
        </div>
        <span class="input-group-addon btn default btn-file">
            <span class="fileinput-new">Select file</span>
            <span class="fileinput-exists">Change</span>
            <input type="file" name="documents-0">
        </span>
        <a href="#" class="input-group-addon btn default fileinput-exists" data-dismiss="fileinput">Remove</a>
    </div>
</div>

我知道如何强制输入元素点击区域保持在Firefox的限制范围内吗？

提前致谢！