正常流的包含块:
包含块由最近的块级祖先框,表单元格或行内块祖先框的内容边界构成。
浮动元素的包含块:
最近的块级祖先元素,浮动元素尽管是行内元素也会生成一个块级框
定位的包含块
根元素:
用户代理(比如浏览器)选择根元素(有的浏览器是html,有的是body)作为 containing block
非根元素:
1.position是relative或者static,包含块是最近的块级祖先框,表单元格或行内块祖先框的内容边界构成。
2.position是absolute,包含块由最近的position值不是static的块元素。
如果祖先是块级元素,containing block 由祖先的 padding edge 形成。
如果祖先是内联元素,containing block 取决于祖先的 direction 属性。
1.如果 direction 是 ltr(左到右),祖先产生的第一个盒子的上、左内容边界是 containing block 的上方和左方,祖先的最后一个盒子的下、右内容边界是 containing block 的下方和右方。
2.如果 direction 是 rtl(右到左),祖先产生的第一个盒子的上、右内容边界是 containing block 的上方和右方,祖先的最后一个盒子的下、左内容边界是 containing block 的下方和左方。
如果没有祖先,根元素盒子的内容边界确定为 containing block。
3.position是fixed,包含块是视窗本身