Html 不符合填充的列表项

我不熟悉html和CSS，但我有一个问题，我的填充似乎不会影响我的列表项。我指的是右上角的“post”框，如下所示：

标题包含以下代码：

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

---

我的问题是，为什么它不像看上去应该的那样向左缩进50px？

您会注意到列表项的背景色为红色

，而您认为与之相关的代码（您在此处发布的内容）的背景色为橙色

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

您希望将目标定位到
#头的
ul
子体：

#header ul { 
  list-style: none; 
  float:right; 
  top: 0; 
  right:50px; /* <- Change this from 0 to 50px */
}

#头ul{
列表样式：无；
浮动：对；
排名：0；
右：50px；/*这是因为
#头ul
是
绝对位置
。这意味着它将忽略其父填充

这应该可以解决它

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

试试这个

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

//右0将跳过所有内容
位置
无论是否指定了
浮动
。只有
浮动
才有效。