Помогите разобраться с z-index

Тема в разделе "Верстка", создана пользователем verfaa, 12 фев 2014.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. verfaa

    verfaa

    Регистр.:
    29 янв 2007
    Сообщения:
    375
    Симпатии:
    41
    Есть сайт

    там изображения товаров выводятся в теге div, который имеет фиксированную высоту и ширину - 190х247px.
    Есть заголовок - НОВИНКИ ХИТЫ ПРОДАЖ. Так вот первый товар наползает на заголовки НОВИНКИ ХИТЫ ПРОДАЖ и получается , что заголовок ссылается на первый товар.
    Как исправить эту ситуацию? Пытался решить проблему, выставляя заголовку значение z-index 10000 и блоку < div class="pre"> значения z-index 1
    Но ничего не меняется. Подскажите как решить проблему.
    PS. просьба сайт из-под хайда не выносить.
     
  2. ZOLK

    ZOLK

    Регистр.:
    13 сен 2011
    Сообщения:
    189
    Симпатии:
    107
    В стиле в #content-hide .title
    добавь position: absolute;

    И в h4.title {
    добавь z-index: 99999999999;
     
  3. kadurinho

    kadurinho

    Регистр.:
    21 июн 2011
    Сообщения:
    602
    Симпатии:
    242
    не пойму какая роль этого куска стилей?
    Код:
    .mozaika_index a, .mebel_index a, .svet_index a, .plitka_index a {
        margin: -32px 10px 0 0 !important;
    }
    закомментируйте или удалите его, всего делов то

    ну а если он играет для вас важную роль

    для h4.title добавляете
    Код:
    z-index: 1;
    position:relative;
     
  4. DragonWerewolf

    DragonWerewolf Писатель

    Регистр.:
    30 окт 2013
    Сообщения:
    3
    Симпатии:
    0
    Для любой работы с z-index необходимо указывать position. absolute или relative, если не хочется поиметь поехавшую верстку =)
     
  5. slim84

    slim84 Постоялец

    Регистр.:
    28 апр 2008
    Сообщения:
    51
    Симпатии:
    18
    Да, margin попровьте:

    HTML:
    .mozaika_index a, .mebel_index a, .svet_index a, .plitka_index a {
    margin: 10px 10px 10px 0 !important;
    }
    И для фиксированной высоты не помешает свойство:

    Код:
    .contant a {
    overflow: hidden;
    }