jQuery animate - 列出带有display:inline-block的项目

时间:2014-03-05 18:10:46

标签: jquery css jquery-animate

我尝试使用jquery animate为列表项的高度设置动画。但是在没有动画的元素上会出现奇怪的“边距”。如果我更改删除display:inline-block,并使用float:left一切正常。我怎样才能实现,但显示:inline-block属性未触及。

这是jsbin:

JSBin - animate display inline block

1 个答案:

答案 0 :(得分:2)

使用vertical-align: top;

.lista li
{
    vertical-align: top;
}

see jsBin updated

inline-block元素是内联级元素。所以,vertical-align will apply to this element

此属性的默认值为baseline。因此,如果你拉伸其中一个元素的高度,行高将被拉伸到更高的高度,其他更低的元素将被放置在“行的基础”。

Other ref to vertical-align property