Я хотел бы центрировать img внутри div без javascript и без фоновых изображений.
Вот пример кода
<div>
<img src="/happy_cat.png"/>
</div>
- Я не знаю размер img, и он должен иметь возможность превышать ширину родительского
- Я не знаю ширину родительского div (это 100%)
- Родительский div имеет фиксированную высоту
- Изображение больше родительского и родительский имеет переполнение: hidden
- Только для поддержки современных браузеров
Желаемый результат. (Игнорируйте непрозрачность и т.д., Просто обратите внимание на позиционирование).
Я знаю, что это можно легко сделать с помощью фоновых изображений, но это не вариант для меня. Я мог бы также использовать javascript, но это похоже на очень тяжелый способ добиться этого.
Спасибо!
Джек