Question

我有一个drupal 7网站，我正在为其添加横幅图片作为内容类型字段。但后来我使用CSS将它定位到具有以下CSS规则的绝对路径。

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

它适用于普通用户，但是当我以管理员身份登录时，由于工具栏覆盖在顶部，位置变得混乱。我该怎么做才能使它适用于管理员。这是页面http://azkaar.com/_mysites/muusa/

Answer 1

嗯..当我看着这个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-index。

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

Answer 2

您遇到的最大问题是您已指定position: absolute。绝对位置是指第一个不是static（默认值）的父级。因此，如果您将position: relative添加到父级，则图像将引用该级别。

由于没有父母具有相对属性，因此图像将放置在页面顶部的引用中。当您以管理员身份登录时，会添加一个必须向下推送所有内容的叠加层，从而搞砸了top: 123px值。尝试添加

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

之后你需要调整绝对定位div的top值。很难给出确切的答案，因为我无法在管理模式下登录并查看该栏用于其css和html的内容。