html - 上下でのみ機能する CSS ボーダー画像

Question

境界線に画像を追加しようとしていますが、現在は上下にしか機能していないようです。コンテナ全体を一周する必要があります。

境界線の画像は次のとおりです。

現在、私のコンテナは次のようになっています。

関連する HTML:

<div class="panel-blurb">
            <p class="panel-blurb-text">    
                Ad molestiae hendrerit mei,
                nobis persius deleniti et eum, ea ullum electram dignissim 
                his. Dicit dolorem moderatius in pro, dicat choro propriae ad mei.
                Dicat legimus efficiendi sit in. Natum falli cu nec. Id hinc regione 
                alienum vel, cu vide atomorum mel. Munere commodo at eos, te laudem docendi 
                volumus pro, maiorum dignissim ex sea.
            </p>
            <div class="panel-link-wrapper">
                <a class="panel-link" href="#">VIEW DETAILS</a>
            </div>
        </div>

関連する CSS:

.panel-blurb{
    width: 88.5%;
    background-color: #54504f;
    padding: 25px;
    border-width: 15px;
    border-style: solid;
    border-image: url(images/border-min.png) 30;
}

Answer 1

あなたはラウンドを追加するのを忘れています

あなたはこのようにすることができます

.panel-blurb{
    width: 88.5%;
    background-color: #54504f;
    padding: 25px;
    border-width: 15px;
    border-style: solid;
    border-image: url(images/border-min.png) 30 round;
}

Answer 2

これを試してください。すべての辺に境界線が表示されます

border-image:url('images/border-min.png') 30 30 round;