View Full Version : Adding a border around images...

04-01-2007, 08:32 PM
Hi everyone, I was wondering if anyone knew an easy way to add a "Border" around an image in CSS.. the webpage is http://www.brownagencies.com/ (goto portraits / click the image) I got some of the problems resolved by using a table but I wanted a hover command to add in a clearish border.

Thanks for any help!

04-01-2007, 08:39 PM
Are talking about a swap image? Basically you want the border to change as you roll over the thumbnail, right? I think the easiest way to accomplish this would be to use the swap image function, you could probly get it to work with an on roll-over and change the border style, but it seems that would be a bit involved for something you could acheive by swapping the image.

04-01-2007, 10:38 PM
I was thinking about that, but with the css I cant.. or rather dont want to have to go back through each image.. I just added a border around it and after the hover it removes the border so it gives the same effect.. I just saw on some websites that they have like a hovering border that follows the images, that would be cool

04-02-2007, 11:39 AM
You should be able to assign borders to the images in question and alter their appearance from color to transparent with the :hover pseudoclass just fine; something like this:

img {
border: 2px solid #000;

img:hover {
border: 2px solid transparent;

(Do note that IE prior to 7 does not support the :hover pseudoclass on anything but a elements; you'll need an additional trick to get IE<7 to play along).

Why don't you show us what you've come up with sofar so we can steer you in the right direction?

04-02-2007, 04:55 PM

04-04-2007, 12:46 AM
can you provide a link to the "hovering border that follows the image" so we can have an idea as to what you are trying to achieve.

I Think I know what you are going for, but as ronald said, you are going to have a bear of a time getting it to display uniformly across browsers. Now this isn't much of a problem if you know the browser make and version of your visitors, or offer a browser detect and browser download link for those not using the proper browser, but as you can guess this creates its own issues.

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum