CSS: Проблема с позиционированием изображений

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; 
} 

я addded г-индекс, если у вас есть вопрос на перекрытии.

Но в 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.