CSS世界一书的疑问。

Question

container容器固定定位，格式化高度占满全屏，text-align: center;可以让inline-block元素居中显示。

设置字体大小为 0 ，这样的话用来代替空白节点的字符 x 的中心位置就是container容器的上边缘（字体大小为 0 时，基线和中线就会重合，而中线位置就是 x 的中心位置）。

理解after伪元素就是一个空白节点，此时这个节点宽度为0，高度为100%，给这个伪元素设置了vertical-align: middle;，此时伪元素的中线和 x 的中线对齐。

如果中心点位置不动，这个伪元素应该会有一半的位置在container容器外面，但是在CSS中是默认左上方排列对齐的，所以，伪元素和原本在容器上边缘的 x 的中心点就一起向下移动了半个容器的高度，也就是此时 x 的中心点就在container容器的中线处。

弹框元素dialog也设置了vertical-align: middle;，此时就会和 x 的中心点对齐，所以就实现了垂直居中的效果。

这段解释中，，但是在CSS中是默认左上方排列对齐的，所以，伪元素和原本在容器上边缘的 x 的中心点就一起向下移动了半个容器的高度， 这句话怎么理解，想不明白什么叫css中默认左上方排列对齐。

Answer 1

这句话的意思应该是行内样式，是从左向右，一行一行向下渲染的吧。
我的理解是，伪元素设置了height:100%;vertical-align: middle;的作用是保证所谓的"X"是垂直居中，这样.dialog这个行内元素设置了vertical-align: middle;属性后，也是垂直居中的效果。