Margin: auto и padding: %; почему Firefox работает отлично от Chrome?

Question

[Aksigera]

https://jsfiddle.net/a3hex6Lw/2/      <---- Код
prntscr.com/9n3403                           <---- Скриншот
Картинка, для которой задан max-height, margin: auto в браузере Chrome масштабируется в оригинальной пропорции за счет увеличения marginа; в Firefox просто растягивается по ширине родителя, margin = 0.
Также, для текста снизу задан padding: 0 5% 5% (padding-bottom: 5%). В Chrome отображается нормально, в Firefox отсутствует. Если задать пикселями - работает одинаково.
Как лечить? Фича браузера, баг или незнание верстки?