菜單項定位問題

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/