Html 什么'；“消除”的正确方法是什么；“保证金”；关于<；李>；在a<；ul>；？

我在ul中有一个li元素列表，其中包含相关的样式类（如下所示）。我希望每个列表项都位于页面的左边缘。在ul和li之间加上边框，我可以看到li项目以令人费解的方式精确缩进了40px

我在两个元素上都尝试了左边距：0px，并且尝试了列表样式：无；这确实有助于消除子弹，并将所有东西滑动到不可破坏的40px边缘

我通过反复试验确定，如果我在li中这样做：

left: -40px;
position: relative;

我得到了期望的结果，但是边距仅仅弹出到每个li的右侧/尾部，这在视觉上不太麻烦，但仍然是一个可怕的攻击。一定有办法让它消失

我的样式代码如下所示：

ul.selectorlist
{
    list-style: none;
    padding: none;
    margin: 0px;

    border-width: 1px;
    border-style: solid;
    border-color: white;
}


li.channel
{
//  left: -40px; // <- Does the trick but COME ON, REALLY?!

    width: 100%;
    background-colour: black;
    font-family:georgia;
    font-size:18px;
    padding: 0px;
    margin: 0 0 0 0;

    border-width: 1px;
    border-style: solid;
    border-color: white;
}

---

在40px线的左右两侧弹出li项目符号。

您是否尝试过使用列表样式的位置 即：

或

在Firefox11中进行的一点实验表明，列表的默认布局包括一个40px的左填充，用于为项目符号腾出空间

加

对于

的样式，您的神秘差距应该消失。但是，这可能会对子弹位置产生不良后果。根据您特定的布局要求，清除项目符号或将

列表样式位置

设置为

内部

都是可能的补救措施

---

请注意，此填充位于

元素上，添加边框时，该元素在视觉上类似于

上的边距。这就是为什么Firebug或Chrome和IE中包含的开发工具如此有用，以至于很容易看到任何元素的框模型的原因之一。

不要忘记

文本缩进

…您确定您的边距优先，并且没有被具有更高特异性的选择器覆盖吗？Firebug或IE之类的工具Chrome开发者工具在追踪类似的事情方面可以起到很大的帮助。此外，如果您没有使用任何类型的HTML重置样式，可能会遇到一些奇怪的浏览器默认值。这是一个非常简单的测试，唯一的其他边距：0在正文内，它也设置为0。Marc B，我尝试了文本缩进，但在两个选择器中都没有效果。这实际上会将项目符号弹出到不可见的40px边距的左侧或右侧。例如，添加'outside'，将项目符号放入实际0和40px不可见边距之间的40px空间。这是值得尝试的。但是，当换行时，将

列表样式位置

设置为

内部

通常会产生不希望的结果（第二行文本与项目符号左对齐，而不是与文本左对齐）。我假设这就是为什么

outside

是默认值。Greg B-虽然它没有反映在问题片段中（我将编辑），是的，我尝试了，但它没有解决问题。有趣的是，缺少它会导致我的ul在页面上垂直移动约5px。当我把它放回去的时候，整个列表又把它压缩到了最顶端——这很奇怪。就是这样！我实际上有“padding:none”，这当然是一个bug。当我把它改为0时，问题就消失了，我现在得到的正是我想要的。谢谢

list-style-position: inside / outside;

list-style-position: inside;

list-style-position: outside;

padding:0;