Extra Custom Mods For Your Template

Now that you have the core custom CSS in place and everything is looking good, here are a few extra bits and pieces that you might want to try.

These are not DOG DAYS specific, they will work with any of the BB2 responsive templates unless stated otherwise.

I hope you find something on this page that will be useful to you.

Rounded Borders & Padding on Images

While you can put a border around images using S.D tools, this uses a bit of custom CSS to lift it to another level. Rather than have to place a border manually around every pic (and you don't have the option to place the padding between border and pic) this custom CSS does it automatically.

So put a picture on your page in the content column and you automatically have a border... color, widths, radius, etc. ... can all be adjusted. This can be changed to also include pics in the side column as well.

#ContentColumn img {
border-radius: 10px;
border: 1px solid #ccc;
padding:2px;
background: #fff;
}

Image Links: Fade On Hover

Hover over the thumbnail links below to see the effect. The hover effect also has a filter applied to change to greyscale (black and white)

a:link img{
opacity:1;
transition:opacity .25s ease-in-out;
-moz-transition:opacity .25s ease-in-out;
-webkit-transition:opacity .25s ease-in-out;
}

a:hover img{
opacity:.6;
filter: grayscale(100%);
}