Custom Border for Images

[icu222much]

i am designing a website with a bunch of different photographs. I am planning to a custom red border around each of these photographs. I am wondering if there is a way (prefer in CSS) where I can just type in the URL for the image and the borders will automatically surrond my photograph?

I have tried setting my border as the background, and load up the image with the CSS tag like this:

#image {
padding-left: 23px;
padding-top: 23px;
background: url('border.jpg') no-repeat;
}

<div id="image">
<img src="image.jpg">
<br><br>
</div>

The problem is that the images will be of various sizes, and I will have to manually adjust the #image for each photograph. Is there an easier way?

I have uploaded a graphical representation of my idea at: http://www.sfu.ca/~jca41/stuph/imageBorder.jpg

[Wickham]

I would use image software liker the free Irfanview http://www.irfanview.com/ where you create a narrow "canvas" around the image with your color.

Or just add a border in CSS to a class:-

.imageborder { border: 3px solid red; }

<img class="imageborder" src="image1.jpg" alt="Image 1">