如何增加upload_file表单的大小

Question

我遇到麻烦了，我在一个表单上并且在这个表单上有一个文件上传字段，在这个字段里面有上传文件的名称（我要放一个截图来显示这部分），但是如果我上传了3张以上的图片该行中断并且文件名不在同一行中对齐，尽管我通过一个可能的修复方法来增加字段的大小或其他内容（idk还行），所以如果你们可以帮助我，我会非常感激！

该字段的IMG重载：] >>

代码：

] >>

<div class="col-4">
      <%= f.file_field :images, multiple: true, placeholder: "Choose file", class: 'file-upload-field' %>
</div> 
            
我有麻烦，我在一个表单上并且在这个表单上有一个文件上载字段，该字段内有上载文件的名称（我将放一个屏幕快照来显示此部分），但是如果我上载了多个.. 。

Answer 1

您必须增加列值才能增加上载字段的宽度。如果您不想更改col-4，则将您的字段放在容器中，给它一个类，并向其中添加一个css属性overflow：hidden。

<style>
.custom-file{
   overflow:hidden;
}
</style>

<div class="col-4">
            <div class="custom-file">
             <%= f.file_field :images, multiple: true, placeholder: "Choose file", class: 'file-upload-field' %>
          </div>
</div>