GIF in Laufschrift einfügen

[gundm]

Hallo,
ich wollte mal wissen, wie man ein GIF vor einen Lauftext kriegt.

Mein Code ist momentan dieser:

<marquee bgcolor="#93E288" height="x" hspace="x" scrollamount="3" scrolldelay="3"><a href="LINK-LINK-LINK-LINK-LINK">
<font color="#FF0000">TEXT-TEXT-TEXT-TEXT-TEXT</font></a></marquee>

Und dieses GIF möchte ich dort VOR dem TEXT-TEXT-TEXT haben. Bei mir erscheint das GIF immer über dem TEXT.
http://gifwelt.info/wp-content/uploads/zug-001.gifhttp://gifwelt.info/wp-content/uploads/zug-001.gif

Wer kann mir weiterhelfen?

Vielen Dank schon mal für Eure Antworten!
MfG,
GundM

 

[threadi]

Meinst Du, dass die Grafik den Text überlagern soll? Dann müsstest Du die Grafik absolute darüber positionieren. Das geht (wie der Name schon sagt) mit der CSS-Eigenschaft "position". Aber Vorsicht: position muss man vorsichtig und mit bedacht verwenden.

Hinweis: Das font-Element gehört zu keinem aktuellen HTML-Standard mehr und könnte bei neueren Browsern sogar ignoriert werden. Alternativ formatiert man Texte wie auch alles andere schon seit Jahren per CSS. Ich würde dir empfehlen auf font zu verzichten.
Ebenso ist das marquee-Element fraglich - es gehört zu keinem aktuellen HTML-Standard und wird auch nur aus Rücksicht noch von neueren Browsern unterstützt. Ich würde dir auch hier empfehlen eher auf eine JavaScript-/CSS-basierte Animation zu setzen.

 

[gundm]

Nein, das GIF soll den Text nicht überlagern sondern es soll hintereinander von rechts nach links laufen.

Kannst du mir denn trotzdem den Code für html sagen?

 

[threadi]

Dann musst Du die Grafik glaube ich einfach nur als img-Element innerhalb des marquee einfügen. Vor oder nach dem Text - wie Du willst.

 

[gundm]

habe ich ja schon probiert, aber dann ist das GIF über dem Text. Kannst ja mal gucken:

<marquee bgcolor="#93E288" height="x" hspace="x" scrollamount="3" scrolldelay="3"><a href="LINK-LINK-LINK-LINK-LINK"><font color="#FF0000"><img src="http://gifwelt.info/wp-content/uploads/zug-001.gif"> TEXT-TEXT-TEXT-TEXT-TEXT</font></a></marquee>

MfG,
GundM

 

[threadi]

Ich glaube Du suchst nach der CSS-Eigenschaft float:
SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

 

[gundm]

Könntets du mir dann mal bitte den Code geben, weil ich es einfach nicht hinkriege, dass das GIF und der Text hintereinander herlaufen. Gerne auch mit CSS.

 

[threadi]

Das ist CSS. Ich kopiere dir mal das Beispiel von o.g. Seite, so angepasst, dass es ein Bild betrifft.

<img src="bild.png" alt="" style="float: left;">

Ansonsten solltest Du dich wirklich mit CSS beschäftigen. Denn das ist das womit Du hier arbeiten musst. Nicht nur bei diesem Problem gerade.

 

[gundm]

O.K. Vielen Dank, das klappt jetzt ja schon.
Doch jetzt siehst es so aus:

Geht das auch noch, dass der Text so ist?:


MfG,
GundM

 

[threadi]

So sollte es mit "vertical-align: middle;" statt float klappen. Siehe auch:
How to Vertically Align Images with Text - CSS Tips

Und beschäftige dich mehr mit CSS.

 

[gundm]

Mit "vertical-align: middle;" funktioniert es leider nicht. Gibt es noch etwas anderes?

 

[Space Vampire]

line-height: [höhe der Grafik]px;

 

[gundm]

Vielen Dank!

Es hat funktioniert.
Viel Spaß weiterhin!