Можно ли применить эффект box-shadow только к левой и правой сторонам div? [Дубликат]

Question

0

Можно ли получить тень окна, примененную только к левой и правой сторонам div?

box-shadow: 0px 0 20px rgba(0,0,0,.4);

Я попытался изменить это на несколько вариантов:

box-shadow: 0, foo, 0, foo;

но это не сработало.

На изображении ниже я хочу удалить нижнюю строку (и верхнюю, но вы не можете видеть это на этом изображении).

Я бы предпочел не использовать изображение, если это возможно.

Patrick Keane 02 дек. 2013, в 19:38

Теги:

2 ответа

APAD1 · Answer 1 · 2013-12-02T16-23-00.000Z

1

Вы можете сделать это, установив тень box: before и: after

div:before {
    box-shadow: -15px 0 15px -15px inset;
}
div:after {
    box-shadow: 15px 0 15px -15px inset;
}

APAD1 02 дек. 2013, в 16:23

0

это просто оказывается грязное решение и не очень хорошо смотрится через браузер
Patrick Keane 03 дек. 2013, в 09:54
1

Грязный как? Он отлично работает в IE, Safari, Firefox и Chrome. Если вы грубите людям, которые отвечают на ваши вопросы, никто не захочет вам помочь.
APAD1 03 дек. 2013, в 16:13
0

Я прошу прощения, если я звучал грубо, но я использовал код именно так, как у вас есть, и он не подходит. Левая тень показывает отлично, правая тень находится в автономном режиме, расположена ниже контейнера. jsfiddle.net/QpHu7 В любом случае я решил не находить исправления для этого и сделал что-то еще вместо этого.
Patrick Keane 09 дек. 2013, в 10:18

Показать ещё 1 комментарий

Hive7 · Answer 2 · 2013-12-02T16-20-00.000Z

В основном способ сделать это - использовать другую тень на верхней части, чтобы вы css выглядели следующим образом:

box-shadow: 0px -45px white,0px 22px white, 2px 0 20px rgba(0,0,0,.4)

это добавляет белый цвет над div, который накладывается поверх моего навигационного меню. Не полезный совет.
Просто повторюсь, не полезный совет для моей текущей ситуации ... Может быть полезным для других, хотя :)