Responsive Images with borders

Due to the css box model and the fact that borders can't be defined as percentages, having images with responsive widths AND borders is an incredible headache.

The solution? Easy, use padding and background colours instead.

img{
    background: #fff; /* border color */
    max-width: 96%;
    padding: 2%; /* equals 100% when doubled and added to the max-width */
}

Boom, baby.