How to Place a Border inside an Element with CSS
Unfortunately, there is no CSS property for creating borders inside HTML elements. We can, however, create the illusion of an inset border by using the
Let's create an HTML element with two class attributes. The first will be a generic name for the class of styling and the second for the inner border effect.
<div class="item inner-border"></div>
box-shadow: inset 0px 0px 0px 10px black;
border: 10px solid blue;
.inner-border class in the example above, we are creating an inset box-shadow with no blur, a 10-pixel width and a black background. The illusion of an inset border is created with the border property.