css shapes – How to add border in my clip-path: polygon(); CSS style – Stack Overflow

Are there any alternate ways to create such a border effect?We can mimic it by applying the same clip-path on a container element. The container element’s background color will look as though it is the border of the inner element because both are clipped and the container has slightly higher dimensions than the inner element.

.poligon {
  display: inline-block;
  position: relative;
  width: 150px;
  height: 150px;
  background: red;
  box-sizing: border-box;
  -webkit-clip-path: ;
  clip-path: ;
}
.poligon img {
  position: absolute;
  top: 2px; /* equal to border thickness */
  left: 2px; /* equal to border thickness */
  width: 146px; /* container height - (border thickness * 2) */
  height: 146px; /* container height - (border thickness * 2) */
 -webkit-clip-path: ;
  clip-path: ;
}

 

Quelle: css shapes – How to add border in my clip-path: polygon(); CSS style – Stack Overflow