Can you create a left/right image border for container in css?

[ne_plus_ultra]

I have two images -- in which I am attempting to use as a left and right border for the main container. Is there a simple way to approach this in css?

[KDLA]

Nest one div (right edge) in another (left edge).

[Primal]

You could place one image on the right in one div, then place the other image on the left in a div inside.

<div id="rightimage">
<div id="leftimage">
</div>
</div>

Looks like KDLA beat me to the punch. :)

[WebJoel]

CSS3 is coming to the rescue (-in about 10 years, maybe!), with:


border-image:
border-top-image
border-right-image
border-bottom-image
border-left-image

and for images-in-corners, we have:

border-corner-image:
border-top-left-image
border-top-right-image
border-bottom-left-image
border-bottom-right-image Mostly, we're waiting for IE to adopt CSS2! :(

[Centauri]

If the container width is fixed, and the images are repeatable vertically, then one horizontal image slice repeated vertically can be applied as a background to the container.

[ne_plus_ultra]

You could place one image on the right in one div, then place the other image on the left in a div inside.

<div id="rightimage">
<div id="leftimage">
</div>
</div>

Looks like KDLA beat me to the punch. :)

Thanks for your help - that makes sense. But when it comes to styling the css would I just use left/right margins?