行内块元素,基线对齐问题


问题:

  行级元素内两个行内块元素,其中一个有文本另一个行内块没有文本,有文本的行内块位置向下偏移:

原因:

  行内块元素的默认对齐方式是:与文字的基线对齐。因此,没有文字的行内块跟有文字的行内块内的文字基线对其。导致有文字的行内块向下偏移。

解决办法:

  给行内块设置 vertical-align:top; 设置行内块顶端对齐。