Cześć Hubert,
z obrazkami można poradzić sobie na kilka sposobów.
1. Jest taka właściwość @media, która działa tylko w określonych warunkach, czyli po media do dajesz warunki i wtedy wyświetla się to co masz w nawiasach{}
Poniżej link do tutorialu
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
w twoim przypadku można by było jeszcze spróbować
with: 100 vw;
Gdzie vw to szerokość okna przeglądarki zamiast 100% bo procenty mogą się odnosić do ramki, w której jest ramka z obrazkiem.
2. Zdjęcia w css można wyświetlać w ramce na różne sposoby i podejrzewam, że tu jest problem
object-fit – odpowiada jak wyświetlają się obrazki
fill — jest to ustawienie domyślne. Rozmiar obrazu jest zmieniany tak, aby wypełnić zadany wymiar. W razie potrzeby obraz zostanie rozciągnięty lub zgnieciony w celu dopasowania
contain — Obraz zachowuje swoje proporcje, ale jest zmieniany w celu dopasowania do podanego wymiaru
cover – Obraz zachowuje proporcje i wypełnia zadany wymiar. Obraz zostanie przycięty w celu dopasowania
none — rozmiar obrazu nie jest zmieniany
scale-down — obraz jest skalowany w dół do najmniejszej wersji „brak” lub „zawieranie”.
Poniżej link do tutorialu na stronie są strzałki next i prev znajdziesz tam więcej przykładów.
https://www.w3schools.com/css/css3_object-fit.asp
Spróbuj
object-fit: cover;
Fajne, że jest prevka, ale z niej nic nie wyczytam musiałbym zobaczyć kod na stronie lub wordpress’a wtedy można by było więcej napisać.
Daj znać, czy pomogło
Pozdrawiam,
Paweł
- Ta odpowiedź została zmodyfikowana 10 miesięcy, 2 tygodnie temu przez
Paweł Zieliński.