the MDN article about box-shadow has an interesting section
Setting zero for offset and blur
When the x-offset, y-offset, and blur are all zero, the box shadow will be a solid-colored outline of equal-size on all sides. The shadows are drawn back to front, so the first shadow sits on top of subsequent shadows. When the border-radius is set to 0, as is the default, the corners of the shadow will be, well, corners. Had we put in a border-radius of any other value, the corners would have been rounded.
We added a margin the size of the widest box-shadow to ensure the shadow doesn't overlap adjacent elements or go beyond the border of the containing box. A box-shadow does not impact box model dimensions.
HTML
<div><p>Hello World</p></div>
CSS
p {
box-shadow: 0 0 0 2em #F4AAB9,
0 0 0 4em #66CCFF;
margin: 4em;
padding:1em;
}
Result
Hello World
that is an interesting color scheme. wonder where they found that
