специфическая тень от блока

Тема в разделе "Вёрстка (HTML, CSS)", создана пользователем alex_vin, 3 май 2013.

  1. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    Хочу создать тень у дополнительного блока.
    у меня такой вид:
    Нашел информацию как это сделать, http://beloweb.ru/novichkam/kak-sdelat-krasivuyu-ten-dlya-bloka-s-pomoshhyu-css-8-primerov.html но что-то не могу применить к своему блоку. Хочу именно стиль 3 или 4.
     
  2. yurets86

    yurets86

    Регистрация:
    13 апр 2013
    Сообщения:
    394
    Симпатии:
    328
    ну так тебе надо еще

    HTML:
    .effect3:before
    {
      z-index: -1;
      position: absolute;
      content: "";
      bottom: 15px;
      left: 10px;
      width: 50%;
      top: 80%;
      max-width:300px;
      background: #777;
      -webkit-box-shadow: 0 15px 10px #777;
      -moz-box-shadow: 0 15px 10px #777;
      box-shadow: 0 15px 10px #777;
      -webkit-transform: rotate(-3deg);
      -moz-transform: rotate(-3deg);
      -o-transform: rotate(-3deg);
      -ms-transform: rotate(-3deg);
      transform: rotate(-3deg);
    }
     
  3. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    если было так, я бы не задавал вопрос, неполучается.
     
  4. yurets86

    yurets86

    Регистрация:
    13 апр 2013
    Сообщения:
    394
    Симпатии:
    328
    ну так выложи весь код, пойми что здесь не нострадамусы сидят, и по кофейной гуще нельзя сказать как тебе сделать не видя кода
     
  5. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    Какой ещё весь код? я же написал код для блока к которому нужно применить этот эффект. Читаем внимательно.
     
  6. yurets86

    yurets86

    Регистрация:
    13 апр 2013
    Сообщения:
    394
    Симпатии:
    328
    если такой умный, че тогда спрашиваешь советы ? тогда читаем внимательно МАНУАЛ на сайте
    http://wmasteru.ru/redirect/?url=ht...en-dlya-bloka-s-pomoshhyu-css-8-primerov.html
     
  7. alex5151

    alex5151

    Регистрация:
    15 ноя 2012
    Сообщения:
    165
    Симпатии:
    26
    В tpl изменили класс "box-product2" на "box-product2 effect3"?
     
  8. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    Да конечно,

    Если нечего подсказать зачем вообще берёшся?
     
  9. alex5151

    alex5151

    Регистрация:
    15 ноя 2012
    Сообщения:
    165
    Симпатии:
    26
    Как я понял надо настраивать конкретно под каждый блок. Поставил у себя - ничего не появилось. Начал менять height блока и о чудо. Так что поэкспериментируйте с параметрами.
     
  10. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    Дело в том что у меня блок в блоке
    .box-product2 {
    а в нем div
    .box-product2 > div {
    поэтому и не получается. Уже пол дня воюю, ничего не выходит. применить просто тень получается без проблем, а вот как эффект 3 или 4 не получается.
     
  11. alex_storm

    alex_storm дизайн, CSS Команда форума

    Регистрация:
    11 дек 2012
    Сообщения:
    1.120
    Симпатии:
    559
    Вы уверены, что блок div точно идет сразу за блоком .box-product2? Поскольку правило ">" гласит, что только при данной вложенности применять стили.
     
  12. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    Абсолютно, вот код из тпл
     
  13. yurets86

    yurets86

    Регистрация:
    13 апр 2013
    Сообщения:
    394
    Симпатии:
    328
    все таки пришлось выложить код?))

    вот тебе решение под хайдом, чтоб в следующий раз не дерзил

     
    alex_storm нравится это.
  14. alex_vin

    alex_vin

    Регистрация:
    28 дек 2012
    Сообщения:
    119
    Симпатии:
    30
    Юморист