CSS 2.1 - vertical align with percentage value
HTML span element uses inherited (from parent div) value of line-height: 24px to calculate 50% of that 24px which gives us 12 px. So span baseline is raised 12 px higher than the parent baseline. Negative values can also be used