JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<h1>Я загадочный блок</h1>
<p>У меня двойная тень, а оберток нет вообще. Практического смысла во мне нет, просто моему автору хотелось проверить, на что реально годны CSS-тенюшки... :)</p>
</div>
CSS
div {
margin: 20px;
background: #fff;
min-width: 490px;
}
div:after {
display:block;
position: relative;
z-index: -1;
top: -5px;
content: '.';
margin: 0 129px;
overflow: hidden;
height: 7px;
-moz-box-shadow: 0 20px 10px 10px #fff, 120px 4px 10px 5px #888, -120px 4px 10px 5px #888;
-webkit-box-shadow: 0 20px 10px 10px #fff, 120px 4px 10px 5px #888, -120px 4px 10px 5px #888;
box-shadow: 0 20px 10px 10px #fff, 120px 4px 10px 5px #888, -120px 4px 10px 5px #888;
}
div p, div h1 {
margin: .75em 1em;
}