内联/内联块元素的css垂直对齐

Question

内联/内联块元素的css垂直对齐我想找几个inline和inline-block控件中垂直对齐的组件。div..为什么span在这个例子中，你坚持要被推倒吗？我都试过了vertical-align:middle;和vertical-align:top;但什么都没变。HTML：<div>   <a></a><a></a>   <span>Some text</span></div>CSS：a {     background-color:#FFF;     width:20px;     height:20px;     display:inline-block;     border:solid black 1px;}div {     background:yellow;     vertical-align:middle;}span {     background:red;} 结果：小提琴

Answer 1

简单地浮动两个元素就可以得到相同的结果。

div {

background:yellow;

vertical-align:middle;

margin:10px;

}

a {

background-color:#FFF;

width:20px;

height:20px;

display:inline-block;

border:solid black 1px;

float:left;

}

span {

background:red;

display:inline-block;

float:left;

}