Salve a tutti amici, ho un problema con i css e il ridimensionamento delle immagini in maniera responsive.

Ho 1 div contenitore e 4 div al suo interno (allineati orizzontalmente tra loro) che contengono rispettivamente 1 immagine ciascuno.

Il mio foglio di stile è il seguente, ma noto con mio dispiacere che le immagini al ridimensionamento della finestra restano della stessa grandezza e, ovviamente, se stringo la finestra ulteriormente tendono solamente ad allinearsi verticalmente.

C'è qualcuno che potrebbe spiegarmi il perchè e darmi una mano?

codice:
#conteiner_box {
    width: 100%;
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
    text-align: center;
    z-index: -1;
}

#conteiner_box > div {
    display: inline-block;
    height: auto;
    max-width:100%;
}

Grazie comunque per l'attenzione.