Ящик-тень за пределами области переполнения

Question

У меня есть пара ящиков внутри контейнера, контейнер установлен в переполнение: скрыт, чтобы убедиться, что все остается в нем и убирает переполнение: скрыто (особенно переполнение-x: скрыто) это не вариант.

Я пытаюсь придать коробкам тень коробок, но при этом тень справа от прямоугольников на правом краю, очевидно, не появляется, потому что родительский объект останавливается там и не имеет переполнения.

Есть ли способ взломать это?

Answer 1

Вы можете добавить поля на внутренний DIV-х?

#inner-div { 
    margin: 10px 
} 

проверка этого JSFiddle

Answer 2

попробовать это один:

div{ 
    top: 100px; 
    position: absolute; 
    left: 100px; height: 50px; 
    width: 200px; 
    -webkit-box-shadow: 
     5px 5px 5px #000, 
     inset 0 0 5px #000; 
    border-radius: 5px; 
    background: white; 
} 

UPDATED DEMO