我正在尝试自动将SELECT大小调整为固定长度INPUT(数字)的左边。像这样:html - 在静态长度INPUT字段左侧自动调整SELECT的大小-LMLPHP

我在选择上使用了可怕的width = 83%,在输入上使用width = 3em得到了这个结果。当然,这完全没有响应。问题是,当我说width = auto时,它将调整为下拉框内容的长度,而不是其所在网格中的可用大小。

因此:如何自动调整SELECT的大小以利用可用的剩余空间?

内容:

<div class="col-4">
<select name="class" style="width:83%; vertical-align:top;">
      <option value=""></option>
      <option value="11" selected>Warlock</option>
</select>
<input style="width: 3em; vertical-align:top; text-align: center;" type="number" step=1 min=1 max=20 name="class_level" value="8">
</div>

最佳答案

使用calc:

select { width: calc(100% - 3em); }


如果需要,在计算中添加一些边距。

关于html - 在静态长度INPUT字段左侧自动调整SELECT的大小,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/57717774/

10-12 00:22
查看更多