JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block">
    <p>Я как бы блок с изогнутыми границами, да, и я могу до некоторых пределов масштабироваться. Вас это удивляет?</p>
    <p>Я мог бы быть еще красивее, если бы браузеры нормально масштабировали картинки в псевдоэлементах, но увы...</p>
</div>

CSS

.block {
    position: relative;
    background: #522009 url(http://img854.imageshack.us/img854/4459/fonhw.jpg) 100% 100% no-repeat;
    padding: 50px 30px 50px 50px;
    color: #fff;
}
.block:before {
    content: url(http://img121.imageshack.us/img121/8832/leftl.png);
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -200px;
    display: block;
    height: 100%;
    width: 10px;
}
.block:after {
    content: url(http://img51.imageshack.us/img51/4601/bottomzd.png);
    position: absolute;
    bottom: -1px;
    left: 0;
    display: block;
    width: 100%;
    height: 20px;
}
p { margin: 0 0 20px; }