Задачка на прокачку: выход из прямоугольника

Задачка на прокачку: выход из прямоугольника

Повторите эффект, когда картинка выходит за рамки родительского блока

Задачка на прокачку — упражнение на знание CSS. Времени на решение уйдёт не много, а размяться поможет. Главное условие — соблюдать ограничения.

Что нужно

Дописать стили и получить результат, как на примере ниже.

Картинка с Хищником должна выходить за край блока-родителя с одной стороны и обрезаться с другой. А текст не обрезается. Если не хватает ширины, блок увеличивается по высоте. Чем больше высота блока, тем лучше видно Хищника.

Анимация выхода из прямоугольника
Цвет фона:
background-color: #ff5722;

Используйте вкладку «CSS» для добавления стилей, а во вкладке «Result» отслеживайте, что получается.

Чего нельзя

Запрещается править HTML. Нельзя использовать Javascript, даже если очень хочется; он тут не нужен.

Решение

Публиковать в комментариях только CSS не стоит, это не наглядно. Размещайте свой вариант решения на jsfiddle.net и делитесь ссылкой в комментариях.