Onkel Schnitzel: Bild in einem Container zentrieren

Beitrag lesen

Hallo,

ich bin etwas aus der Übung. Ich hoffe, Ihr könnt mir weiterhelfen. Ich habe eine Box mit der Eigenschaft text-align: center; und float: right. Beim Skalieren der Schriftgröße im Browser verschiebt sich der linke Rand der Box. Die Elemente in der Box, die ja zentriert werden, verändern also dementsprechend auch ihren Abstand zum linken Rand.

Jetzt möchte ich in der Box einen Button positionieren und darüber einen Text. Wenn ich dafür einen Container nehme und als Hintergrundbild meinen Button lade, sieht das erstmal toll aus, doch beim Skalieren der Schriftgröße wird nur der Text zentriert, das Hintergrundbild behält den gleichen Abstand zum linken Rand. Dadurch haut das natürlich alles nicht mehr hin. Das Zentrieren des Buttons habe ich nur mit dem img-Tag hinbekommen, aber darüber kann ich ja keinen Text platzieren.

Ich hab etliches ausprobiert, aber momentan fällt mir einfach nix mehr ein. Wie kann ich also ein Bild mit darüberliegendem Text in einer Box zentrieren, die beim Skalieren um eine andere Box floatet?

Besten Dank schonmal,
Onkel Schnitzel