Imagens responsivas com bordas

Devido ao modelo css box e ao fato de que as bordas não podem ser definidas como porcentagens, ter imagens com larguras e bordas responsivas é uma incrível dor de cabeça.

A solução? Fácil, use cores de preenchimento e de fundo.

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

Boom, baby.