菜单项定位问题

Question

我正在尝试创建一个标题菜单。请查看我的代码:http://jsfiddle.net/kc2cc/.

我的意图是，如果用户点击菜单项(标志，地点，事件或组)，那么被点击的元素将向下移动1px，直到点击它回到原始位置。在Chrome 15中一切正常，但在Firefox和IE中，如果我点击一个元素，所有的元素都向下移动。

原因是什么，我该如何解决它?由于

Answer 1

我真的不知道为什么，但似乎是ul#navigation li的默认值baseline导致了这个问题。把它改成middle或其他任何东西都可以解决这个问题。

ul#navigation li {
    border-right: 1px solid #F5F5F5;
    display: inline-block;
    height: 35px;
    vertical-align: middle;
}

Answer 2

set vertical-align: top for <li>http://jsfiddle.net/kc2cc/13/