Блог

Главная - Вопросы по программированию - Как мне сделать так, чтобы фон тега a располагался поверх фона моего div?

Как мне сделать так, чтобы фон тега a располагался поверх фона моего div?

#css #html

#css #HTML

Вопрос:

Новый вопрос. Я пытаюсь использовать z-index, но, похоже, он работает не так, как я ожидал. Вот мой код:

 <a id="favoritelink" href="#" style="margin-left: 600px" class="addtofavorites" title="Add to Favorites"></a>
<div class="description" style="margin-top: -18px">
   Some description
</div>

В css я указал z-индекс для .description как 1, а для .addtofavorites как 10. #favoritelink содержит фоновое изображение и текст, который смещен далеко от страницы (по сути, это ссылка на изображение). Фон .description по-прежнему находится поверх фона для .addtofavorites .

Я хочу, чтобы фон .addtofavorites был сверху.

Вот css для .addtofavorites и для .description:

 .description
{
    background:#efefef;
    width:600px;
    max-height:500px;
    padding:12px;
    z-index:1;
}
.addtofavorites
{
    background:url(img/plus.png) no-repeat center;
    background-size:75%;
    display:block;
    text-indent:-9999px;
    width:51px;
    height:56px;
    margin-right:6px;
    z-index:10;
 }

Ответ №1:

Вы должны использовать position: relative или position: absolute для z-index работы.

Редактировать: http://jsfiddle.net/GndRj/4 / На основе вашего кода, но добавлено position: relative и уменьшено поле -оставлено включенным .favoritelink , чтобы оно отображалось в окне предварительного просмотра.