Mathias Brodala: Text über Grafik legen

Beitrag lesen

Hallo Scream.

Ich will einen Text über eine Grafik legen.
Das Problem ist dass die Grafik keine feste Position hat und ich daher keine Möglichkeit weiß wie ich das anstellen kann.

Je nachdem, wie du die strukturell angehen möchtest, sehen die Lösungsmöglichkeiten unterschiedlich aus.

Hat die Grafik ausschließlich dekorativen Charakter und vermittelt keinerlei Inhalt? Wenn ja, dann solltest du die Grafik als http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=Hintergrundgrafik einsetzen.

Hat die Grafik doch einen inhaltlichen Wert, bietet es sich an, Grafik und Text in ein gruppierendes Element zu stecken. Im weiteren ist es erforderlich, dass sich der Text noch in einem weiteren Element befindet. Nun werden sowohl das gruppierende als auch das den Text umspannende Element relativ und die Grafik absolut http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=positioniert. Die relative Positionierung des gruppierenden Elementes sorgt dafür, dass sich seine Kindelemente bei einer Positionierung an ihm orientieren, da dies ansonsten am Viewport erfolgen würde.

Und je nachdem, ob der Text vor oder hinter der Grafik im HTML notiert wurde, ist ggf. noch der Einsatz von http://de.selfhtml.org/css/eigenschaften/positionierung.htm#z_index@title=z-index vonnöten.

Einen schönen Mittwoch noch.

Gruß, Mathias

--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]