CSS：图像定位问题

我有一个Drupal7站点，我正在为它添加一个横幅图像作为内容类型字段。然后我使用CSS将其定位到绝对路径，并使用以下CSS规则

    .field-name-field-banner-image {
        position:absolute;
        top:123px;
        left:50%;
        margin-left:-490px;
    }

对于普通用户来说，它工作得很好，但当我以管理员身份登录时，由于顶部的工具栏覆盖，位置会变得混乱。我该怎么做才能让它也为管理员工作呢。

---

这是页面

嗯。。当我查看这个css时，你可以创建字段名字段横幅图像中心

 .field-name-field-banner-image {
    position:absolute;
    top:123px;
    left:50%;
    margin-left:-490px;
}

尝试将布局的特定宽度设置为

 margin-left:-490px;

应该是这样的

.field-name-field-banner-image {
    width:980px;
    position:absolute;
    z-index:200;
    top:123px;
    left:50%;
    margin-left:-490px;
}

如果你有重叠的问题，我添加了z索引

---

但在drupal中，我认为这是管理方面的问题。尝试联系drupal支持。

您遇到的最大问题是您指定了

位置：绝对
。绝对位置参照的第一个父对象不是静态的（默认）。因此，如果将
position:relative
添加到父对象，则图像将参照该父对象

由于没有父对象具有相对属性，因此图像将参照页面顶部放置。当您以管理员身份登录时，会添加一个覆盖，该覆盖必须向下推送所有内容，从而使
top:123px
值出错。尝试添加

div#wrapper { position: relative; }
.field-name-field-banner-image { top: 113px; }

之后需要调整绝对定位div的
top
值。很难给出准确的答案，因为我无法在管理模式下登录，也无法查看工具栏的css和html使用了什么。
这是Drupal如何根据登录状态处理某些元素的问题。我的建议是，您可以找到一个完全替代的方法，而不是在不同的情况下尝试使其工作。您可以在drupal.stackexchange.Comoveral中询问，这听起来很合理，谢谢。如果我将#wrapper定位为相对，则横幅的直接父div将继承它。但所有这一切都取决于它们之间的任何其他元素是否也没有以某种方式定位。如果我将直接父div定位为相对，会怎么样？我会根据你的建议尝试不同的东西，并在这里更新。最有可能的是，我将继续这个网站的管理员，但我不想做一些其他人在网站上工作，可以很容易地搞砸了。这个定位在CSS中总是很棘手的。所以它不会继承，但是横幅是根据设置为相对的最接近的父项定位的。它与#wrapper配合使用效果最好，因为工具栏覆盖层保持在它上面。谢谢