ФЭНДОМ


На страницу

<div class="block">
<div class="border">
СЮДА КОНТЕНТ</div>
</div>

CSS в CSS

.block {
  background: red;
 
  margin: 20px auto;
  padding: 5px;
  position: relative;
  display: block;
}
 
.border {
  left: 0px;
  top: 0px;
  right: 0px;
  bottom: 0px;
}
 
.block:before,
.block:after,
.border:before,
.border:after {
  position: absolute;
  width: 28px;
  height: 28px;
  content: '';
  border-color: #fff;
  border-style: solid;
}
 
.block:before {
  left: 0px;
  top: 0px;
  border-width: 9px 0 0 9px;
}
 
.block:after {
  right: 0px;
  top: 0px;
  border-width: 9px 9px 0 0;
}
 
.border:before {
  right: 0px;
  bottom: 0px;
  border-width: 0 9px 9px 0;
}
 
.border:after {
  left: 0px;
  bottom: 0px;
  border-width: 0 0 9px 9px;
}
Материалы сообщества доступны в соответствии с условиями лицензии CC-BY-SA , если не указано иное.