html - CSS border image only working on top and bottom -


i trying add image border, right appears working top , bottom. need go around entire container.

here border image:

enter image description here

here container looks like:

enter image description here

relevant 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 @ 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> 

relevant 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; } 

without border-image

div {    width: 300px;    height: 300px;    background-color: #545050;    background-image: url('data:image/png;base64,ivborw0kggoaaaansuheugaaabeaaaarcaiaaac0d9ctaaaaaxnsr0iars4c6qaaaarnqu1baacxjwv8yquaaaajcehzcwaadsmaaa7dacdvqgqaaaazdevydfnvznr3yxjlahbhaw50lm5ldca0ljaumtctcgraaaabf0leqvq4t12sb3ldmawe+uslygfyzov/n8ickbulmxgv4a71wjnbkcwp1j22mo8un6g9pfbs1mr30srfmvfb72xyoi/oazbpnqodus5hayx0ny5wzqtvcue5omycp+gdwkbnln6fkfigjq29cvjwbizloh1arwatqwovll1fuwfga4wf2sogq7qffk9mmweop7oaxckiacdcer3ytl0ib2a0q9c8gk9lbja0wc/jycuuwhfpeps33euucqpt4iud4wvvlorjyxpykfggyq/ovre06+fbsfg+xd12cwqkejjhx2/80hshah96swqsrsuf2g4vlojla00wjr3a4yvqboyb1kmlsmem9/sy4vonw4apld4f+abkhrtebkpulpg7zmknteq/2ieginx5oxzlpizoj+oiiavr6kppnseilxirno3xtmpl+ys3iqviungbjsizooayppu8xbrncv2s6wise3cnaielit1ulda2ljytaslqvks2ndfll6fpmkcfxz4t98bmcayaaaaasuvork5cyii='), url('data:image/png;base64,ivborw0kggoaaaansuheugaaabeaaaarcaiaaac0d9ctaaaaaxnsr0iars4c6qaaaarnqu1baacxjwv8yquaaaajcehzcwaadsmaaa7dacdvqgqaaaazdevydfnvznr3yxjlahbhaw50lm5ldca0ljaumtctcgraaaabf0leqvq4t12sb3ldmawe+uslygfyzov/n8ickbulmxgv4a71wjnbkcwp1j22mo8un6g9pfbs1mr30srfmvfb72xyoi/oazbpnqodus5hayx0ny5wzqtvcue5omycp+gdwkbnln6fkfigjq29cvjwbizloh1arwatqwovll1fuwfga4wf2sogq7qffk9mmweop7oaxckiacdcer3ytl0ib2a0q9c8gk9lbja0wc/jycuuwhfpeps33euucqpt4iud4wvvlorjyxpykfggyq/ovre06+fbsfg+xd12cwqkejjhx2/80hshah96swqsrsuf2g4vlojla00wjr3a4yvqboyb1kmlsmem9/sy4vonw4apld4f+abkhrtebkpulpg7zmknteq/2ieginx5oxzlpizoj+oiiavr6kppnseilxirno3xtmpl+ys3iqviungbjsizooayppu8xbrncv2s6wise3cnaielit1ulda2ljytaslqvks2ndfll6fpmkcfxz4t98bmcayaaaaasuvork5cyii='),  url('data:image/png;base64,ivborw0kggoaaaansuheugaaabeaaaarcaiaaac0d9ctaaaaaxnsr0iars4c6qaaaarnqu1baacxjwv8yquaaaajcehzcwaadsmaaa7dacdvqgqaaaazdevydfnvznr3yxjlahbhaw50lm5ldca0ljaumtctcgraaaabekleqvq4t12tdbldiaiepwljp6hjev9lva9n89lo0blfll021emor5f33oij1rj8fl1+ogy/pkya91cxvw8lnqvwzdrcwvyepg27c86hvsyxt1ejvtfmnr5ne7jkfid7trhsqj0nhvpr9bmtvja4z4cjq70k2moe7fqojkbcslhjjylyot3vc3aowrqavhc/gcgzjjbknexmi7gpg8nf1uvqwrhddil0yvq6giyeltwikeyslz/u6godawbdt14ow2xkuponwybpfwloncwbsqryfibdgbsasq8ms5hkitm1npeg9fpgrce2ophh25jt7phhbimupjc0lfuipwel/dq3egcbk7sa4bh2xcytvwqtpk4o/y0mg8hubbidtncxz8rc39tz1pj0h5gjqysimwcpodjva6p63j3ppriktlztmbkgxvjjaxzkkybydgm7f9q2y2b9sqaad/dere+l+dksffps9b1typvfalb24flmsebydydqczp0d2xllfeyeyfoaaaaaelftksuqmcc'  ),  url('data:image/png;base64,ivborw0kggoaaaansuheugaaabeaaaarcaiaaac0d9ctaaaaaxnsr0iars4c6qaaaarnqu1baacxjwv8yquaaaajcehzcwaadsmaaa7dacdvqgqaaaazdevydfnvznr3yxjlahbhaw50lm5ldca0ljaumtctcgraaaabekleqvq4t12tdbldiaiepwljp6hjev9lva9n89lo0blfll021emor5f33oij1rj8fl1+ogy/pkya91cxvw8lnqvwzdrcwvyepg27c86hvsyxt1ejvtfmnr5ne7jkfid7trhsqj0nhvpr9bmtvja4z4cjq70k2moe7fqojkbcslhjjylyot3vc3aowrqavhc/gcgzjjbknexmi7gpg8nf1uvqwrhddil0yvq6giyeltwikeyslz/u6godawbdt14ow2xkuponwybpfwloncwbsqryfibdgbsasq8ms5hkitm1npeg9fpgrce2ophh25jt7phhbimupjc0lfuipwel/dq3egcbk7sa4bh2xcytvwqtpk4o/y0mg8hubbidtncxz8rc39tz1pj0h5gjqysimwcpodjva6p63j3ppriktlztmbkgxvjjaxzkkybydgm7f9q2y2b9sqaad/dere+l+dksffps9b1typvfalb24flmsebydydqczp0d2xllfeyeyfoaaaaaelftksuqmcc'  );    background-position: top center, bottom center, center left, center right;    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;  }
<div></div>


Comments