嗨，我正在嘗試實作一個可折疊的側邊欄，但是每當我切換折疊按鈕時，元素都在移動。
我在 SO 上檢查了很多問題，但找不到解決方案。
但是當我點擊切換按鈕時：
圖示之間添加了一些隨機空間，它們會改變位置，我如何才能使這些圖示或元素保持靜態/粘性？我不想讓他們動。
uj5u.com熱心網友回復：
您可以嘗試將這種樣式用于側邊欄：
position: sticky;
top: 0;
align-self: start;
演示
uj5u.com熱心網友回復：
首先，您可以嘗試將其添加到您的 css 中：
#sidebar.active .sidebar-header {
padding-top: 104px;
}
這將補償圖片消失的大小。
然后，我看到即使隱藏了鏈接文本， 您的鏈接內仍然有兩個不間斷的空格 ( )。您應該洗掉它并將文本與 a 對齊padding-left。
我已經看到您padding: 20px 10px;為 the添加了，#sidebar.active ul li a但這會改變 sidenav 中鏈接的填充，因此它們不再具有相同的大小。我已經洗掉了。
還是會出現一個問題：當你的sidenav增長時，要顯示的文本沒有展開的地方，所以會回傳到下一行，我們不希望這樣。
為防止這種情況，您可以在 sidenav 內添加一個容器，該容器將始終保持相同的 size。或者您可以嘗試修復鏈接的大小，以便不顯示不合適的文本，如您所選擇。
我已經編輯了你的JsFiddle。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/338628.html
下一篇：將視頻浮動到我的網頁右側