Помогите разобраться с :before

Тема в разделе "Верстка", создана пользователем zditovetsky, 21 май 2015.

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

    zditovetsky Постоялец

    Регистр.:
    20 май 2014
    Сообщения:
    81
    Симпатии:
    10
    Стоит задача, на изображение товара, в категории, повесить бейдж "скидки". Я его повесил с помощью :before но он отображается только если ссылка на изображение не действительна.
    http://newlight.com.ua/novelty
     
  2. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.130
    Симпатии:
    668
    ни у одного из представленных по ссылке товаров не висит бейджа.
     
  3. zditovetsky

    zditovetsky Постоялец

    Регистр.:
    20 май 2014
    Сообщения:
    81
    Симпатии:
    10
    Сделайте ссылку на изображение товара недействительной, и он появится.
     
  4. WRed

    WRed Вредный

    Регистр.:
    9 янв 2013
    Сообщения:
    165
    Симпатии:
    164
    Не легче добавить в шаблон virtuemart-a див для futured ? а на него уже вешать css.
     
  5. tovGANs

    tovGANs Создатель

    Регистр.:
    19 июн 2012
    Сообщения:
    33
    Симпатии:
    3
    проще повесить на ссылку класс "sale", наприме, который будет иметь background с со скидкой
     
  6. WRed

    WRed Вредный

    Регистр.:
    9 янв 2013
    Сообщения:
    165
    Симпатии:
    164
    Причем тут это ? Иконка будет заходить за изображение...
     
  7. tovGANs

    tovGANs Создатель

    Регистр.:
    19 июн 2012
    Сообщения:
    33
    Симпатии:
    3
    Я подумал как в приведенном пример, - надо просто картинку вставлять.
    Если надо поверх, можно перед картинкой внутри ссылки прописать span c тем же классом и навесить картинку на класс спана. Соответственно выставить position: absolute; bottom: 0; right: 0; display: block; а еще если постоянная ширина-выоста на тумбе картинке, то и их надо фиксированными
     
  8. EuRo1985

    EuRo1985 Постоялец

    Регистр.:
    21 апр 2015
    Сообщения:
    99
    Симпатии:
    6
    Я тоже считаю, что в данном примере удобнее через позиционирование сделать. Для родителя указываете position: relative, а для бейджика - position: absolute. Ну и top-left уже спокойно позиционируете.
     
  9. ArFree

    ArFree Создатель

    Регистр.:
    30 май 2015
    Сообщения:
    37
    Симпатии:
    12
    Задам вопрос тут: если поверх такого бейджа, который выводится отдельным абсолютно позиционированным блоком нужен еще один маленький бейдж. То лучше:
    1) Сделать его как и предыдущий, и наслаивать их через z-index
    2) Все-таки сделать для первого бейджа :before и через него уже реализовать 2й "бейдж потомок"
    ?
     
  10. Smooch

    Smooch Создатель

    Регистр.:
    7 фев 2014
    Сообщения:
    10
    Симпатии:
    7
    От задачи зависит, before удобнее и проще, но все же больше для статики подходит, к нему js обращается только через костыли по моему
     
Статус темы:
Закрыта.