我有一個父容器 div 和一些子元素，但是只有一個子元素垂直居中。我不知道我做錯了什么。instagramwrapper 垂直對齊，但包含其他兩個子元素的包裝器仍然位于頁面頂部。html:<div class="Container"><div class="headerWrapper"> <div> <span>Information & Advice</span> </div> <div> <span>From the daylight experts</span> </div> </div><div class="wrapper"> <app-carousel></app-carousel> <app-guides></app-guides></div> <div class="instagramWrapper"> <app-instagram></app-instagram></div> CSS： .Container { padding: 0; height: 100%; margin: 0; display: flex; align-self: center; align-items: center; justify-content: center; flex-direction: row; width: 100%; } .wrapper { width: 780px; /* inherit parent width */ } .instagramWrapper { width: 500px; padding-left: 10px; margin-left: 2px; /* inherit parent width */ }據我了解，“align-items”可以在彈性容器當前行的橫軸上對齊？
1 回答
LEATH
TA貢獻1936條經驗 獲得超7個贊
您的容器的高度可能為 100%。但它的父級的高度是 100% 嗎？
嘗試以下操作：
html, body {
height: 100%;
}這將使文檔的高度為視口的 100%，以便 .Container 獲得文檔的 100%。
您的兩個內部元素（instafeed 和左側的列）的位置將有所不同，具體取決于它們的大小。
- 1 回答
- 0 關注
- 112 瀏覽
添加回答
舉報
0/150
提交
取消