Redimensionar imagens automaticamente com o tamanho do navegador usando CSS

Você deseja que suas imagens sejam redimensionadas automaticamente quando você redimensionar a janela do navegador, mas o código fornecido não está funcionando. Vamos investigar uma solução.

Para tornar as imagens flexíveis, você precisará adicionar max-width: 100% e height: auto a elas. No entanto, o IE8 tem um bug onde isso não funciona. Para corrigir isso, adicione width: auto\\9 para IE8.

img {
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

Qualquer imagem adicionada usando a tag img agora será redimensionada automaticamente.

Para ilustrar, aqui está um exemplo de JSFiddle que não requer JavaScript. É compatível com as versões mais recentes do Chrome, Firefox e IE (com base em testes).