CSS：当被ul、li、/li标签包围时，a块向右移动

Question

3

我将使用 ul 和 li 标签组合制作菜单，并使用 display box 和背景颜色将其显示为按钮。问题是，一旦我使用 li 将 a 标签包装起来，这些按钮似乎向右移动了一点类似于缩进或者其他什么东西。

我尝试了：

list-style: none;

但是这并不起作用，有人能提供解决这个问题的方法吗？

谢谢，任何帮助都将不胜感激。

感谢大家的努力，对所有答案点赞。

- koool

1

你能贴出更多的代码吗？这样我们就可以看到你尝试了什么。 - Alex

当然，我会提供一个 Fiddle，稍等一下。 - koool

4个回答

4

你是否重置了默认的边距和填充样式？

ul,li {
margin:0;
padding:0;
}

- Stuart Burrows

2

您需要检查 UL 和 LI 元素的 margin 和 padding，并将它们设置为特定值。例如：

margin: 0;
padding: 5px;

通常情况下，UL的样式会从左侧缩进，但在某些浏览器中可能是LI（我相信）。

在Firefox（带有Firebug），Chrome和IE9中，您可以使用开发人员工具检查应用的样式。这真的有助于了解此类显示元素中出现问题的原因。

另外，如果您以前没有看过它，请查看盒子模型：

- Jared Farrish

1

浏览器会为 ul 和/或 li 元素提供默认的边距和/或填充。尝试在你的 ul, li {} 中添加 margin: 0; padding: 0。

更好的方法是使用 CSS Reset 来解决这个问题，以及其他许多元素的问题。我推荐使用这个：http://meyerweb.com/eric/tools/css/reset/。

- user527892

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- punkrockbuddyholly · Accepted Answer

在 ul 上设置 padding-left 和 margin-left 值为 0。