Question

我是html和CSS的新手，但我遇到的问题是我的填充似乎不会影响我的列表项。我所指的是这里看到的右上角“帖子”框：

标题包含以下代码：

#header { background-color: orange; height: 60px; line-height: 60px; padding:0px 50px; }

我的问题是，为什么这样看起来不应该向左侧缩进50px？

Answer 1

这是因为#header ul是position absolute。这意味着它将忽略其父级填充。

这应该解决它

#header ul {
   float: right;
   list-style: none outside none;
   position: relative;
}

Answer 2

试试这个

#header ul {
    list-style: none outside none;
    position: absolute;
    right: 50px;
    top: 0;
}

//右0将跳过所有内容

Answer 3

您会注意到您的列表项目有红色 background-color，而您认为与之相关的代码（您在此处发布的内容）的背景颜色为<强>橙即可。

您的邮箱是#header元素中的元素，而不是#header元素本身。

您希望定位ul的{{1}}后代：

#header