Hintergrundbild erscheint oben auf Vordergrundbild in Opera und Chrome

StackOverflow https://stackoverflow.com/questions/2400884

  •  18-09-2019
  •  | 
  •  

Frage

Ich habe eine kleine Spanne mit einem Hintergrundbild. Dieses Hintergrundbild scrollt unten Vordergrundbild. Während diese perfekt in IE und FF funktioniert, funktioniert es nicht in Opera und Chrom.

Ich habe mein Beispiel setzen hier . Bitte beachten Sie den Block mit 4 kleinen Rechtecken.

Bitte machen Lösung.

War es hilfreich?

Lösung

Sie müssen display:block auf Ihre Spanne hinzuzufügen. 

<span style="display:block; background: url(&quot;/resources/images/strength_bgr.gif&quot;) no-repeat scroll 0pt -20px transparent;">
  <img alt="test" src="/resources/images/strength.gif">
</span>

Inline-Elemente haben keine Höhe oder Breite, so dass der gesamte Hintergrund wird durch die Bildgröße wird abgeschnitten stattdessen angezeigt wird.

Bearbeiten nach Kommentaren

Gibt es einen Grund, warum Sie nicht das Hintergrundbild auf dem img-Tag selbst anwenden können? Das wäre konsequent Cross-Browser.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top