Hintergrund skaliert nicht auf Chrome Mobile

Liebe Leute,
die unten genannte Website wurde mit WP, dem Astra-Theme und Elementor erstellt.
Jede Unterseite hat ein eigenes Hintergrundbild, welches ich jeweils über eine custom body-Klasse mit css so einbinde:

body.uebermich {
background-image: url(„xxxxx“);
background-repeat: no-repeat;
background-position: 50% 50%;
background-attachment: fixed;
background-size: cover;
}

Leider verhalten sich dann aber die mobilen Browser unterschiedlich.
Als Beispiel dient die Unterseite „Über mich“:
Der mobile Firefox verkleinert korrekt, man sieht den Kopf, der sich auf dem Hintergrund befindet, vollständig.
Jedoch bei Chrome und dem Samsung-eigenen Browser ist das Bild viel zu groß und man sieht nur den Haaransatz am Scheitel…:-(
Da chrome ja auf webkit basiert, wird es wohl bei Safari oder MS ähnlich aussehen…
Ich habe dann mit folgender media query probiert, für Mobile einfach ein kleineres Bild einzubinden, leider ohne Erfolg:

@media only screen and (max-width:768px) {
body.uebermich { background-image: url(„xxxxx-KLEIN“);
background-repeat: no-repeat;
background-position: 50% 50%;
background-attachment: fixed;
background-size: cover;
}
}
Auch eine media query, die für Mobile mit background-size: 100% (statt cover) arbeitet, hat nichts genutzt und auch kein !important.
Jetzt bin ich ein bisschen ratlos…
Wie bringe ich ALLE mobilen Browser dazu, die Hintergründe vernünftig zu skalieren oder abhängig von der Screen-Größe andere Bilder anzuzeigen?
Vielen Dank im Voraus für jeden Tip!
BG, Tobias

• Dieses Thema wurde geändert vor 5 Jahren, 3 Monaten von clavigo.
• Dieses Thema wurde geändert vor 5 Jahren, 3 Monaten von clavigo.

Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]