Box With Images (multiple background)

by infous

HTML

<div class="box-with-images">
    <div class="content">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nulla libero velit at eius obcaecati et dolores cupiditate pariatur quam deleniti tempora possimus voluptatem fuga beatae natus! Nostrum voluptas hic minus!</p>
    </div>
</div>

CSS

body {

    margin: 20px;
}

.box-with-images {
    background: url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/cr_top_left.png) no-repeat, 
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/cr_top_right.png) top right no-repeat,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/cr_bottom_right.png) bottom right no-repeat,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/cr_bottom_left.png) bottom left no-repeat,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/tb_top.png) top left repeat-x,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/tb_bottom.png) bottom left repeat-x,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/ss_left.png) top left repeat-y,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/ss_right.png) top right repeat-y,
        url(http://www.simf.yessoftware.com/Uploads/box-with-images/1/box_007_ct.png);
    position: relative;
    width: 300px;
}

.content {
    padding: 20px;
}