Очевидно: не использовать overflow: hidden на контейнере, не класть в контейнер c overflow: hidden, добавить больше внутренних отступов контейнеру с overflow: hidden...
Изначально брать большую картинку и уменьшать, лол. Чудес не бывает.
Есть конечно upscale нейросетки, которые иногда даже работают неплохо, но придётся подождать ещё десяток-другой лет, пока ты сможешь юзать их у себя на сайте в realtime.)
opacity же наследуется без вариантов, а потому если хочется применить именно её, то придётся серьёзно корячить вёрстку - разделяя её на два блока: прозрачный и нет, и накладывая их позиционированием друг на друга.
>браузер
Какой, , браузер? Хром, Осёл, Фокс? А может древняя опера тебя радует?
Очевидно что такие технические вещи, не относящиеся к веб-стандартам, имеют совершенно разные решения в зависимости от конкретного приложения.
Например в firefox есть параметр командной строки предназначенный специально для этого: --kiosk URL. Для других браузеров потрудитесь нагуглить сами.
Ну берёшь button и ставишь background'ом картинку, или берёшь картинку в svg и оборачиваешь в button, после чего кладёшь эту button меж input'ами. В чём проблема то?
