Przepraszam za brak odpowiedzi.
Co do umieszczenia chatu, teraz skłaniam się do innego rozwiązania: dla elementu iframe
o ID box1
usuń (zakomentuj) deklaracje position
oraz height
. Znajdują się one u Ciebie w pliku style_nowy.css
w selektorze .video-container iframe, .video-container object, .video-container embed
. U mnie działa (chat zjeżdża pod wideo). Ale również rekomenduję, byś po zmianie odświeżył stronę, raz F5, a potem CTRL+F5.
Co do drugiego pytania... 3 kwestie:
- zachowanie proporcji 16:9,
- trzymanie proporcji względem siebie,
- dopasowanie do okna.
Myślę, że zachowanie wszystkich tych trzech rzeczy naraz nie jest proste w przypadku, gdy występują między nimi zależności, np. tak jak tutaj położenia oraz rozmiaru. Ja nie mam wystarczającego doświadczenia, by znaleźć rozwiązanie i sugerować Ci jego wybór. Ale na kilka rzeczy mogę zwrócić uwagę:
Ad 1. – proporcje można dla każdego wideo z osobna (lub ich kontenerów) ustawić zgodnie z tymi instrukcjami: https://www.w3schools.com/howto/howto_css_aspect_ratio.asp. Czy u Ciebie da się to prosto ustawić? Nie sądzę; ale na pewno ustawić się da, spróbuj. Najważniejsze (ale nie jedyne ważne) to padding-top: 56.25%;
.
Ad 2. – trzymanie proporcji względem siebie jest zależne od jednej rzeczy w sumie: jakie wymiary będzie mieć ustawione jedno i/lub drugie wideo (lub kontener). Zakładając, że chcesz mieć również 16:9 dla obu z nich: jeśli wymiary obu wideo będą dopasowywać się przy zachowaniu tej proporcji do strony (na szerokość, bo na wysokość raczej nie sądzę, by miało dla Ciebie znaczenie), to wtedy proporcje po prostu będą "automatycznie" trzymane. Jeśli nie, to będziesz musiał zrezygnować albo z trzymania proporcji względem siebie, albo z 16:9 któregoś wideo.
Ad 3. – Dopasowanie do okna jest zależne tak samo tylko od wymiarów wideo (lub ich kontenerów).
W idealnym przypadku (jestem, stety lub niestety, perfekcjonistą, dlatego o tym piszę), przy dobrym projekcie strony (a przynajmniej samych kontenerów, czyli najczęściej elementów <div>
), wystarczyłoby że ustawisz szerokość LUB współczynnik proporcji JEDNEGO wideo (wszystko jedno, którego), a dopasowanie względem siebie proporcji oraz dopasowanie do okna, a także proporcje drugiego wideo, powinny zostać automatycznie zachowane.
Tak poza technikami CSS: sugerowałbym, żebyś zastanowił się, czy jest sens zmieniać to, co jest teraz (poza położeniem wideo względem chatu). Wydaje mi się, że dobrze to wygląda; proporcje np. małego wideo nie są w mojej opinii złe (250px:150px, co daje różnicę ok. 0,1 w stosunku do proporcji 16:9). Zobacz jeszcze proporcje dużego wideo.