插入LI元素jQuery的外观不同于硬编码的

Question

我有一个菜单（请参阅示例）。它有两排。上面的一个是硬编码的，最下面的是用jquery插入的。问题是，上面的行在LI元素之间有一些间距，而底部的行没有。我错过了什么？

例子：http://jsfiddle.net/s3rVg/

Answer 1

如果删除上面的列表中的元素[li]的HTML失去它的空白，以及之间的空白。像：

<li class="" onclick="/admin/oink;">Oink</li><li class="" onclick="/admin/super;">Piglet</li> 

由于这uglifies的HTML，你也可能想看看这个discussion。尤其是乔恩格兰特的答案可能是一个选择。

Answer 2

的答案很简单：

你插入一个加空间分成两个硬编码<li>项目。

看这里：:)

http://jsfiddle.net/s3rVg/2/

Answer 3

在你的CSS你writen xmargin: 0 5px 0 0 ;，这是无效的，而不是由浏览器识别。当你只写margin: 0;它将删除li的空间。你应该总是validate your CSS！

另外，您的代码中有两次相同的ID，但ID必须对文档是唯一的。