我已經設定了這個stackblitz
您可以在 styles.css 檔案中看到，我將選項下拉 div 的寬度設定為 650px 的固定寬度，這在這種情況下有效
@import '~bootstrap/dist/css/bootstrap.min.css';
.my_choices_inner {
display: inline-block;
vertical-align: top;
width: 100%;
padding: 0;
margin-top: -2px;
min-height: 44px;
overflow: hidden;
}
.choices__list--dropdown,
.choices__list[aria-expanded] {
word-break: break-word;
width: 650px;
}
.choices {
margin-bottom: 0;
}
但我真的很想讓寬度自動調整為下拉 div 中當前存在的選項的長度。
當我將寬度設定為“100%”時，它不會溢位容器。我也試過“fit-content”和“auto”都無濟于事。
我需要做什么才能實作這一目標？
編輯：準確地說：文本不應該換行，應該在一行中
uj5u.com熱心網友回復：
我已經修改了代碼，請檢查以下鏈接：
https://stackblitz.com/edit/js-vb71zr?file=style.css,index.js,package.json
在這里，我修改了 CSS 代碼，使選擇的 div 動態化。
此外，我還添加了 1 個用于測驗的虛擬值選項。重繪 頁面并測驗它。請提供上面的示例鏈接，如果您發現任何問題，請告訴我。
編輯：這是最重要的部分：
.choices__list--dropdown,
.choices__list[aria-expanded] {
word-break: break-word;
width: max-content;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/537877.html