PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : text um grafik mit vertical-align middle



msi
03-03-2005, 20:54
Hallo,

ich habe eine Formel als Bilddatei. Diese möchte ich nun in den Textfluss laufen lassen, so wie es bei Latex mit $ formula $
möglich ist.
Das ganze möchte ich gerne ohne Tabellen realisieren.



<p>
Das ist der Text der um das Bild liegt
Das ist der Text der um das Bild liegt
Das ist der Text der um das Bild liegt
<span class="formula" style="width: 85px; height: 42px; background-image: url('fomula.png')">hier die formel</span>
Das ist der Text der um das Bild liegt
Das ist der Text der um das Bild liegt
Das ist der Text der um das Bild liegt
Und so weiter und so fort...
</p>


das span tag wird mit css noch so formatiert, dass der Text nicht sichtbar ist und nur das Hintergrund Bild, also die Formel lesbar ist:



.formula { text-indent: -4000px; /* ugly hack: hide the text */ }


kennt jemand eine Möglichkeit dies zu realisieren??

danke Markus

Ps: an den style angaben im span element komm ich wohl nicht rum, weil ja die höhe und breite und das bild selbst gesetzt werden müssen..
Oder kennt jemand eine andere Technik?

Wieso ich span verwende um die Formel anzuzeigen? Nun ich möchte, dass auch Leute, die nicht-grafische Browser verwenden ein ordentliches Ergebnis kriegen und da die Formel im Vordergrund steht und nicht das Bild ist meines erachtens nach span schöner als img.

BlueJay
05-03-2005, 08:39
Wie soll der Text lesbar sein?
Sind die Zeilen durch das Bild unterbrochen (lästig), oder ist links und rechts ein Leseblock?

Was möglich ist:
Block 1 mit float:left starten, Bild mit Float:left dranhängen, dann den letzen Block eintippern. Eventuell width und height angeben und/oder mit clear nachkorrigieren. (IMHO eine noch schlimmere Frickelei als mit Tabelle, die sich immerhin selbst den optimalen Platz für ihre Spaltenbreite sucht.)

Was ich am übersichtlichsten fände:
die Formel mit float:right oder left nach aussen schieben, damit man den Rest ungestört lesen kann. (Hier wäre Tabelle tatsächlich überflüssig.)

Tip: als alt-Tag die Formel als C- (oder andere Programmiersprache) Zeile angeben.

so long,
BlueJay

msi
05-03-2005, 10:35
Hallo,
danke erstmal, die Formel soll wie ein Text dastehen und nicht am Rand stehen.
Da die Formel allerdings höher ist, muss der Text der links und rechts daneben ist vertikal zentriert werden. So wie ich es oben gemacht habe, ist der Text unten ausgerichtet, so dass zB bei einer Formel m. Bruchstricht der Text links und rechts daneben auf der selben höhe wie der Nenner ist. Ich möchte den Text allerdings auf der höhe des Bruchstrichs haben.
Den Text möchte ich nicht in mehrere Blöcke trennen, das soll schon alles in einem p-Tag stehen.
Markus

BlueJay
05-03-2005, 17:04
Dann dürftest du mit
style="vertical-align:middle" im img-tag gut bedient sein.

so long,
Bluejay

msi
05-03-2005, 18:52
Dann dürftest du mit
style="vertical-align:middle" im img-tag gut bedient sein.

so long,
Bluejay

das bild ist aber größer als der Text, ich muss so ein vertical align irgendwie auf den Text anwenden, aber genau das krieg ich ja nicht hin!