height

set height explicitly

Avoid explicitly setting the height of an element to avoid overflow issues.

Specifying a is problematic.
% refers to the parent's size.
parent's height is typically determined by the height of its children. This produces a circular definition that the browser can’t resolve, so it’ll ignore the declaration.

For percentage-based heights to work, the parent must have an explicitly defined height. 🗣
如果都是用 %，則一路從 html ⟩ body ⟩ .... ⟩ 到自己的直屬母物件都要明確設定 %，否則只要中間有一層斷掉也是沒用。

/*
   當我們設定 height: 100% 時，此設定並不會真正發生作用，
   除非它的母物件有「明確設定」height。
   ⭐️ 注意：設定母物件的 min-height 並沒有幫助❗️
 */
i-vstack:only-child {
    height: 100%;
}

Last updated 3 years ago

Was this helpful?