Stephanie EcklesWhen you define a typical CSS border, the corners join together at a 45-degree angle:
border-width exaggerated for effect
Instead, we can use a combination of border and box-shadow to produce a square border join:
Open the Codepen to play around with the values, and set $insetBorder to false to place the bottom "border" below the left border.
