Из за чего картинка не обращает внимания на max-width?
Это баг https://bugzilla.mozilla.org/show_bug.cgi?id=975632
Добавить.wrapper {
    ....
    table-layout: fixed;
    width: 100%;
}
img{
    max-width: 100%;
}
Заменить  max-width: 150px; и min-width: 150px; на.two {
    ....
    width: 150px;
}
table-cell это ячейка таблицы и на неё не действует max/min-width и плюс max/min-width с одинаковым значением это все равно что width 150
и это тоже не нужно.main {
   .....
    width: 100%;
    max-width: 200px;
}
jsfiddle.net/ufwvr90r
Масло масляное... width - ширина, max-width - максимально возможная ширина. Не понятно чего хотите...
Если картинка должна быть по размеру блока, достаточно width:100%.
Если речь о размере картинки без учета блока - здесь написано.
Если хотите ограничить определённым размером картинку внутри блока, тогда значение max-width не должно быть в процентах. Указывайте в px, в em, cm, mm или чем то еще более конкретном.