А в правом нижнем углу с отступами в 4% снизу и 6% справа как сделать? :) За фичу спасибо - знания лишними не бывают, может когда-то пригодится на тестовом задании выпендрится. Но в коммерческой разработке такое будет использоваться примерно никогда.
Background-image всем хорош, когда надо изображение сделать фоном. В данном случае фона нет - элемент изображения является не фоном, а основой конструкции. Размер элемента с классом .wrapper должен подстроиться под размер изображения. Так понимаю, что предлагается убрать элемент img, а картинку передать во wrapper как фон. И откуда в таком случае мы возьмем размеры для wrapper?
Этим и плох CSS, что одно и тоже можно сделать уже не 3, а 5 разными способами. Брр, потом начинается какой-то кавардак, особенно в долгоживущем легаси