1 回答

TA貢獻1818條經(jīng)驗 獲得超3個贊
在這個特定的例子中,min-width帶有給定斷點(例如400px)并overflow: auto設置在.container將工作正常
.container {
max-width: 800px;
min-width: 400px;
overflow: auto;
background-color: beige;
}
.btn {
width: 80px;
}
.btn span{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
}
<div class="container">
<button class="btn"><span>test</span></button>
<button class="btn"><span>test123</span></button>
<button class="btn"><span>test450354053</span></button>
<button class="btn"><span>test23R02020202</span></button>
<button class="btn"><span>test33030494</span></button>
<button class="btn"><span>test403930390</span></button>
<button class="btn"><span>test</span></button>
<button class="btn"><span>test23423049</span></button>
<button class="btn"><span>testé</span></button>
<button class="btn"><span>test2340</span></button>
<button class="btn"><span>test234234</span></button>
<button class="btn"><span>test2342</span></button>
<button class="btn"><span>test2342020</span></button>
<button class="btn"><span>test2202349</span></button>
<button class="btn"><span>testé</span></button>
<button class="btn"><span>test234029</span></button>
<button class="btn"><span>test20203030</span></button>
<button class="btn"><span>test340</span></button>
<button class="btn"><span>test234240</span></button>
<button class="btn"><span>test2342340</span></button>
<button class="btn"><span>test23420420</span></button>
</div>
- 1 回答
- 0 關注
- 143 瀏覽
添加回答
舉報