辅助元素居中一点疑问。
在写这个例子的时候，发现在外层设置font-size12，也就是最小字号了。span元素设置vertical-align为middle或者不设为middle都没有作用。但是在内层设置，也就是在span元素和i元素上分别设置font-size12，span元素设置vertical-align为middle或者不设middle却有相应。下面放上代码。希望能得到大家的帮助。
div{
font-size: 12px;
background: #ccc;
text-align: center;
line-height: 100px;
}
span{
vertical-align: middle;
background: pink;
/*font-size: 12px;*/
}
i{
height: 100%;
display: inline-block;
vertical-align: middle;
background: red;
/*font-size: 12px;*/
}<div> <span>我是span</span><i>1asdvas <br> 2</i> </div>
