To use these borders, save the image file (the smaller square), edit/recolor as you see fit, and upload to your own site. Use the code inside of each block and be sure to change the url.
The code provided will stretch to any size, but you can set a specific size by modifying the width and height characteristics. (If you don't set the width and height, the pixel details may be lost.) Read more about css border images from Solaria!
.floral {
border: 30px solid transparent;
padding: 10px;
border-image: url(borders/floral.png) 30 30 round;
overflow: auto;
margin: 5px;
}
This box is 460 px wide by 400 px tall.
.floral2 {
border: 21px solid transparent;
padding: 15px;
border-image: url(borders/floral2.png) 21 round;
overflow: auto;
margin: 5px;
}
This box is 466 px wide by 333 px tall.
.thistle {
border: 26px solid transparent;
padding: 15px;
border-image: url(borders/thistle.png) 26 round;
overflow: auto;
margin: 5px;
}
This box is 549 px wide by 394 px tall.
.lily {
border: 26px solid transparent;
padding: 15px;
border-image: url(borders/lily.png) 26 round;
overflow: auto;
margin: 5px;
}
This box is 460 px wide by 364 px tall.
.morningglory {
border: 26px solid transparent;
padding: 10px;
border-image: url(borders/glory.png) 26 round;
overflow: auto;
margin: 5px;
}
.vines1 {
border: 23px solid transparent;
padding: 10px;
border-image: url(borders/vines1.png) 23 round;
overflow: auto;
margin: 5px;
}
.vines2 {
border: 16px solid transparent;
padding: 10px;
border-image: url(borders/vines2.png) 16 round;
overflow: auto;
margin: 5px;
}
.mini1 {
border: 11px solid transparent;
padding: 10px;
border-image: url(borders/mini1.png) 11 round;
overflow: auto;
margin: 5px;
}
This box is 448 px wide by 349 px tall.
.mini2 {
border: 9px solid transparent;
padding: 10px;
border-image: url(borders/mini2.png) 9 round;
overflow: auto;
margin: 5px;
}
.mini3 {
border: 11px solid transparent;
padding: 10px;
border-image: url(borders/mini2.png) 11 round;
overflow: auto;
margin: 5px;
}
.frame1 {
border: 18px solid;
border-image: url(borders/frame1.png) 18 round;
margin: 5px;
}
.frame2 {
border: 50px solid;
border-image: url(borders/frame2.png) 50;
margin: 5px;
}
.frame3 {
border: 10px solid;
border-image: url(borders/frame3.png) 10 round;
padding: 5px;
margin: 5px;
}
.frame4 {
border: 30px solid;
border-image: url(borders/frame4.png) 30 round;
padding: 5px;
margin: 5px;
}