我无法用 <li> 删除边距 [重复]答案

【问题标题】：I can't remove the margin with <li> [duplicate]我无法用 <li> 删除边距 [重复]
【发布时间】：2011-10-03 00:59:37
【问题描述】：

你知道为什么我不能从我的<li> 元素中删除边距吗？浏览器总是为我的列表添加特定的边距，即使我在代码中编写了特定的边距。这是 CSS 和 HTML 代码：

#NavLeftList {
    height: 57 % ;
    width: 15 % ;
    position: absolute;
    top: 23 % ;
    border-style: none;
    background: url(images / heaven.jpg);
    margin: 0px
}

#NavLeftList ul {
    margin-left: 11 % ;
}

#NavLeftList ul li {
    text-align: center;
    width: 170px;
    list-style-type: none;
    text-decoration: none;
    margin: 10px 0px 0px 0px;
    padding: 1px;
}

#NavLeftList li a {
    height: 35px;
    padding: 10px 0px 0px 0px;
    text-decoration: none;
    color: #fff;
    background: url(images / tabright.gif);
    display: block
}

#NavLeftList li a span {
    padding: 0px
}

#NavLeftList li a: hover {
    color: #7EC0EE;
}

我没有在这里粘贴 HTML 代码，因为它看起来很奇怪。

【问题讨论】：

使用代码格式发布您的 HTML。请参阅常见问题解答。
@Frank1985：这种行为是 Chrome 特有的吗？ IE 和 FF 按预期渲染？
您不能在堆栈溢出帖子中包含任意标记。使用 Dabbler 之类的沙箱和/或将代码内联到代码块中。
@Sidncious，但如果它都被标记了，没有人愿意阅读它。这就是four-spaces markdown formatting is for：选择所有应该格式化为代码的代码，然后按下有用的{} 按钮。

标签： html css html-lists margin

【解决方案1】：

尝试使用 reset.css 文件，该文件将重置不同浏览器中所有“默认”（因此是不同的）填充和边距实现。

示例：CSS Reset

【讨论】：

【解决方案2】：

在li 上尝试list-style-position:inside;。即使您设置了list-style-type:none;，它也可能会留下被子弹填充的空间

【讨论】：

【解决方案3】：

尝试设置

body{margin: 0;}

或找到 NavLeftList 的包含元素并将该元素的边距设置为 0。

【讨论】：

【解决方案4】：

您看到的不是lis 上的边距，而是ul 上的填充。

将ul 的填充清零。

【讨论】：

@Frank1985 太好了！很高兴我能帮助你。当某个答案适合您时，单击它旁边的小复选标记按钮以“关闭”该问题并将其标记为您接受的答案。

【解决方案5】：

尝试遵循 UL 的 CSS

ul { list-style: none; }

【讨论】：

这是一个试图回答的问题，不应通过 LQP 删除。（如果您不喜欢它，请随意投反对票。）