0

Собственно есть рамка в фотошопе, но как сверстать - не знаю. Получается криво.. Делал через border-image

введите сюда описание изображения

1
  • Используй border-image
    – Qwertiy
    Commented 28 июл. 2016 в 9:01

1 ответ 1

4

Как вариант, на основе jsfiddle #1, jsfiddle #2
display: inline-block для срабатывания верхнего margin без этого он схлопывается и эффекта бордера не будет.

.outside {
  background-color: transparent;
  background-size: 14px 14px;
  background-image: repeating-linear-gradient(-45deg, black, black 5px, transparent 5px, transparent 10px);
  height: 100px;
  width: 200px;
}

.inside {
  background: white;
  margin: 10px;
  height: 80px;
  display: inline-block;
  width: 180px;
}
<div class="outside">
  <div class="inside"></div>
</div>

Поддержка repeating-linear-gradient

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.