Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS定位的小錯誤 #126

Open
oopDaniel opened this issue Dec 17, 2018 · 0 comments
Open

CSS定位的小錯誤 #126

oopDaniel opened this issue Dec 17, 2018 · 0 comments

Comments

@oopDaniel
Copy link

oopDaniel commented Dec 17, 2018

這段有個錯誤:

absolute的containing block(容器块)计算方式跟正常流有什么不同?

  无论属于哪种,都要先找到其祖先元素中最近的 position 值不为 static 的元素,然后再判断:
  1、若此元素为 inline 元素,则 containing block 为能够包含这个元素生成的第一个和最后一个 inline box 的 padding box (除 margin, border 外的区域) 的最小矩形;
  2、否则,则由这个祖先元素的 padding box 构成。
  如果都找不到,则为 initial containing block。

  补充:
  1. static(默认的)/relative:简单说就是它的父元素的内容框(即去掉padding的部分)
  2. absolute: 向上找最近的定位为absolute/relative的元素
  3. fixed: 它的containing block一律为根元素(html/body),根元素也是initial containing block

absolute: 向上找最近的定位为absolute/relative的元素 應該是向上找最近的non-static元素(包括fixed)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant