向右推 CSS 导航项

Question

我正在尝试处理布局，但我遇到了导航问题。如果您查看下面发布的 Codepen 并将鼠标悬停在导航中的“主页”链接上，将出现下拉菜单并将其他主要链接推到左侧。是什么原因造成的，我该如何解决？我已经弄乱它​​几个小时了，我迷路了。感谢您的帮助。

http://codepen.io/anon/pen/Cmcyr

Answer 1

a、ul 或 li 没有设置宽度，所以当 ul 是显示时，父级正在扩展到其最宽子级的宽度。

从 li 中移除水平填充并设置 text-align: center; 并给它们或它们的父级 (ul) 一个最大宽度与其父级 (a) 相同或更窄。