[HTML]Responsywność a height headera, Nie dopasowana do urządzeń mobilnych Opcje

[baentizo]

Mam problem ze stroną którą zrobiłem.
W komputerze wygląda idealnie, na telefonie zresztą też - schody zaczynają się w momencie rozdzielczości powyżej 640 px
height headera który odpowiada dobrej wysokości zarówno w telefonie jak i komputerze przy innej rozdzielczości wygląda tak - jest po prostu ucięte.

Dopiero po zmianie na height: 600 px na niektórych urządzeniach wygląda wzorowo, za to na telefonie tak, a na komputerze tragedia.

Urządzeń/rozdzielczości jest sporo i każda grafika ma swoje height które powinno automatycznie je ustawiać - w zależności od urządzenia w którym przeglądamy stronę - od 300 po 600 px

Walczę z tym (bezskutecznie) od ponad miesiąca - albo header jest ucięty, albo za wysoki.
Co robić?

[Lord]

A możesz wstawić ten header jako img a nie jako bg? i usunąć wysokośc header, wtedy powinien header być dostosowany do wysokości obrazka. Inna sprawa najlepiej jakbyś dał link do strony bo tak to cieżko coś pomóc

[baentizo]

A możesz wstawić ten header jako img a nie jako bg? i usunąć wysokośc header, wtedy powinien header być dostosowany do wysokości obrazka. Inna sprawa najlepiej jakbyś dał link do strony bo tak to cieżko coś pomóc

www.quitteray.pl


A możesz wstawić ten header jako img a nie jako bg? i usunąć wysokośc header, wtedy powinien header być dostosowany do wysokości obrazka.

Nie działa. Chyba że źle robię Jakąś instrukcję?

[Lord]

https://jsbin.com/gigapeludo/edit?html,output