我正在尝试自动将SELECT大小调整为固定长度INPUT(数字)的左边。像这样:
我在选择上使用了可怕的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/