box-shadow-around-the-full-box.md

title	description	date	mainImage.isAnchor	tags	draft
Box Shadow around the full box	Sometimes when coding a UI element you want a shadow around, rather than inset from, the element	2019-03-08 19:30:51 UTC	false	entry boxshadow css border code development tip	false

Sometimes when coding a UI element you want a shadow around the whole box. However, most CSS box-shadow examples/tutorials tend to show inset box-shadows or ones that otherwise sit off to the side.

Here’s how to apply box-shadow to the whole box for a simple but nice effect.

.box-with-shadow {
  box-shadow: 0 0 4px #ccc;
}

And here’s how it looks:

Lorem ipsum