✔ text im bild

[anyany]

hi ich hab ein problem, ich will auf ein bild 318x351 ein text in der mitte von dem bild ausgeben, ich habs jetzt schon mitm div versucht in dem ich das bild geladen hab und den text per style and die geswuenschte positions zu brinken klappt aber irgendwie noch nich ganz

 

[Gumbo]

Du könntest die Grafik als Hintergrund einsetzen, beispielsweise:

<p style="width:318px; height:351px; background-image:url(…); text-align:center"> … </p>

 

[anyany]

jetzt ist es schonmal horizontal inner mitte und wie bekomm ichs jetzt vertikal in die mitte?

 

[Maik]

Hi,

wenn es sich hierbei um einen einzeiligen Text handelt, lässt sich dieser mit Hilfe der line-height-Eigenschaft vertikal zentrieren:

<p style="width:318px; line-height:351px; background-image:url(…); text-align:center"> … </p>

Und beachte bitte unsere Netiquette (Nr.15) bzgl. deiner durchgehenden Kleinschreibung. Vielen Dank.

 

[anyany]

Nein es ist leider ein mehrzeiliger Text der dynamisch erzeugt wird.

 

[Gumbo]

Folgendes ist möglich:

<p style="display:table-row; background-image:url(…)"><span style="display:table-cell; width:318px; height:351px; text-align:center; vertical-align:middle"> … </span></p>

Die Unterstützung der display-Eigenschaftswerte table-cell und table-row vorausgesetzt.

 

[anyany]

Folgendes ist möglich:

<p style="display:table-row; background-image:url(…)"><span style="display:table-cell; width:318px; height:351px; text-align:center; vertical-align:middle"> … </span></p>

Die Unterstützung der display-Eigenschaftswerte table-cell und table-row vorausgesetzt.

Funktioniert leider auch nicht, leigt vielleicht dadran das die Displayfunktion nicht unterstützt wird, wo kann ich nachgucken ob diese unterstuetzt wird? ich habs jetzt ganz billig mit ein paar <br> gemacht :S

 

[Maik]

Eine Übersicht der unterstützten Eigenschaften bzw. Eigenschaftswerte findest du hier:

1. http://www.thestyleworks.de/quickref/tables-12.shtml#sdisplay
2. http://www.css4you.de/browsercomp.html