Search code examples
imagecssborderglow

How to create a white glow border around an image


How can I create a white glow as the border of an unknown size image?


Solution

  • Use CSS (not supported in IE<9)

    img {
        box-shadow: 0px 0px 5px #fff;
    }
    

    This will put a white glow around every image in your document, use more specific selectors to choose which images you'd like the glow around. You can change the color of course.

    If you're worried about the users that don't have the latest versions of their browsers, use this:

    img {
    -moz-box-shadow: 0 0 5px #fff;
    -webkit-box-shadow: 0 0 5px #fff;
    box-shadow: 0px 0px 5px #fff;
    }
    

    For IE you can use a glow filter (not sure which browsers support it)

    img {
        filter:progid:DXImageTransform.Microsoft.Glow(Color=white,Strength=5);
    }