I am working on a [website](http://optcflairbot.tumblr.com/) where a user can select an icon and send it as a request to one of my bots.

I've already got it sorted out. I'm mainly just working on improving the aesthetics.

What I want to happen is, when hovering over an icon (or even selecting it), it shows a light blue background colour to indicate that it's been selected, because right now there is nothing to indicate a chosen icon except for the div at the very top (which isn't always in sight when you scroll further down).

The code I have atm is:

```
.flair:hover, .selected{
        background-color: #3498db;
        border-radius: 2px;
    }

```

I've tried adding some padding but since each image is in a spritesheet, it will overlap with other images.

I've also tried using a border instead to emulate the same effect, but hovering over an image would slightly move the other images due to the border being applied and it gets annoying.

Is there some way I can get my background-color to 'overflow' behind the images?