子菜单创建了额外的空间

Question

我尝试使用子菜单制作垂直css菜单。我已经完成了一些研究，并且无法找到我特定问题的答案。 li中的ul正确定位（编辑：我喜欢li> ul中的第一个li与li一致，＆＃34; 1＆＃34;内联＆＃34; Two＆＃34; ），但含有ul的li会变大，我不希望这种情况发生。 这里的例子： http://cssdesk.com/PHPNv

Answer 1

你非常接近，但我做了一些改变，可以帮助你。

nav li {
  background:#abcdef;
  border-bottom:solid 1px #9abcde;
  color:#000;
  display:block;
  padding:1em 0;
  text-align:left;
  text-indent:1em;
  text-decoration:none;
  width:100%;
  position:relative; /* need to add so nested elements are positioned relative to the current menu item */
}

nav li:hover ul {
  display: block;
  top:0;
  width:100%;
  position:absolute; /*need position absolute here to take it out of the 'flow'*/
  left:100%;
}