我無法理解為什么col-auto占用的空間超過了其內容所需的最小空間。
請參閱此示例
為什么？我想要發生的是最后一列正是按鈕的寬度，而其他列的其余部分展開以進行補償。
我的代碼是這樣的：
<form>
<div class="form-row d-flex">
<div class="col-md-1">
<input class="form-control">
</div>
<div class="col-md-2">
<input class="form-control">
</div>
<div class="col-md-4">
<input class="form-control">
</div>
<div class="col-md-4">
<input class="form-control">
</div>
<div class="col-md-auto">
<button type="button" class="btn btn-link">X</button>
</div>
</div>
</form>
uj5u.com熱心網友回復：
考慮：
<form>
<div class="form-row d-flex">
<div class="col-md-1">
<input class="form-control">
</div>
<div class="col-md-2">
<input class="form-control">
</div>
<div class="col w-100">
<input class="form-control">
</div>
<div class="col w-100">
<input class="form-control">
</div>
<div class="flex-shrink-1">
<button type="button" class="btn btn-link">X</button>
</div>
</div>
</form>
這樣，col-md-4 的兩個 cols 將被拉伸，而按鈕 col 將收縮到按鈕的寬度。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/421172.html
標籤：
上一篇：對齊問題和引導按鈕修改