ff 1.5 - "align=middle" bei geringer höhe falsche

z8400

hallo,

ich habe von 1.07 auf 1.50 upgedatet und war über die darstellung meiner webseite doch etwas erstaunt, anscheinend rendert die neue version anders (die höhe der gesamten seite entspricht jetzt mehr der darstellung im internet explorter).

aber:

"align=middle" funktioniert bei grafiken KLEINER HÖHE nicht korrekt im zusammenhang mit text.

in den folgenden beispielen fehlt die referenzierte grafik (ich habe das beispiel aus selfhtml - mit vorhandener grafik ist das ergebnis qualitativ das gleiche wie beschrieben). der browser stellt ein leeres rechteck dar.

bei grafiken "großer höhe" ist die anzeige korrekt (in der vertikalen mitte bezüglich des textes):

p>Denkt der Denker
<img src="denker.gif" width="70" height="137" align="middle" alt="Denker">
an die Mitte?</p>

bei grafiken "geringer höhe" ist die grafik so angeordnet, dass ihre mitte mit der "baseline" des textes identisch ist. im folgenden beispiel wurde gegenüber oben nur die höhe von 137 auf 13 geändert (z.b. um eine minigrafik vor einem text anzuzeigen:

p>Denkt der Denker
<img src="denker.gif" width="70" height="13" align="middle" alt="Denker">
an die Mitte?</p>

in ff 1.07, in nvu (mit dem ich meine seiten erstelle) und im ie werden die kleinen grafiken "korrekt" angezeigt. - oder habe ich bisher etwas falsch gemacht?

auf http://www.ing-rb.de/ seht ihr, was ich meine. mit ff 1.50 sind die auswahdreiecke alle hässlich nach unten gerutscht. bisher waren sie auf der höhe des textes.

weiß jemand abhilfe - oder habe ich bisher etwas falsch gemacht?

das ganze ist besonders extrem, wenn der text relativ klein ist!

grüße, z8400

suennen

Ich habe leider das gleiche Problem mit der 1.5. Ich hatte da gestern Abend auch eine sehr lange Schock-Sekunde, denn ich empfehle meinen Kunden fuer mein Redaktionssystem FireFox in der neuesten Version zu nutzen und jetzt habe ich in allen Installationen diesen Darstellungsfehler.

Auf der anderen Seite ist das Alignment in img-Tags eh deprecated und sollte in sofern auch nicht mehr eingesetzt werden.

Um das Alignment HTML-konform und cross-Browser kompatibel wieder an den Start zubekommen, habe ich folgendes gemacht:

- die (kleinen) Images an denen das Alignment erfolgen soll auf die Hoehe der auszurichtenden Schrift gebracht (css: line-height)
- in den img-Tags align="middle" gegen style="vertical-align: middle;" getauscht

Abhilfe schaffen wuerde statt 'middle' den Wert 'absmiddle' zu verwenden, was allerdings auch nicht zu empfehlen ist, da kein HTML-Standard und somit ab in die Tonne.

Wer sich das Online anschauen moechte kann das auf http://www.livegigs.de tun.
(Ich hoffe mich erschlaegt keiner, wenn ich hier bei meinem ersten Posting einen externen Link setze ...)

Sollte jemand eine einfachere Loesung gefunden haben, waere ich dankbar, denn ich muss mich noch durch einige Installationen wuehlen ...

Gruesse
Rolf

k-ei

Genau dasselbe Problem habe ich auch.
Siehe:
http://www.firefox-browser.de/forum/viewtopi…1b3a75637ee0099

Und auch ich wäre dankbar für Lösungsvorschläge.

JonHa

Ich habe im obengenannten Thread meine Lösung gepostet.

JonHa

k-ei

... und ich habe dort geantwortet, weil deine Lösung leider nicht funzt...

Simon1983

Dann lies JonHas Post nochmal!

Er hat Styles angegeben und du benutzt HTML das kein HTML Standard ist.

k-ei

Gibt es einen Weg, mein HTML zu korrigieren, oder komme ich an Styles nicht vorbei? (Bis jetzt habe ich noch nicht mit Styles gearbeitet, sondern nur amateurhaft mit Nvu rumgefrickelt.)

JonHa

Wenn du nur amateurhaft in NVU rumfrickelst solltest du nicht davon ausgehen, dass deine Seiten wirklich funktionieren. Wobei NVU noch ne gute Qualität hat. Wenn ich da an Frontpage denke...

ansonsen sehe ich das problem nicht. Kannst du nicht style="vertical-align:middle;" angeben?

Simon1983

Laut Standards ist HTML dazu gedacht das Baugerüst darzustellen. CSS dagegen ist dann Tapete und Farbe :lol: .

k-ei

@ JonHa:

Eigentlich sollte ich alles weitere im Nvu-Forum erörtern, aber da ich mich hier nun schonmal als DAU geoutet habe und mein Ruf schon prima ruiniert ist, erlaube ich mir noch eine weitere dumme Frage. Ich erbitte euer aller Toleranz

Ich habe Nvu bisher fast nur als WYSIWYG-Editor benutzt - wie gesagt: "amateurhaft" und ohne nennenswerte Eingriffe in den Quelltext. Aber bis zum FF 1.5 hatte ich den Eindruck, dass meine Seiten durchaus funktionieren.

Natürlich mag es gar kein Problem sein, style="vertical-align:middle" anzugeben... nur: für einen WYSIWYG-Dödel wie mich ist es ein Problem, weil ich mich im Quelltext ziemlich verloren fühle. Wo nur gebe ich diese schlichte Zeile ein...?

Bitte nicht hauen!
Eure Antwort lautet jetzt bestimmt: "siehe: SelfHTML"
Aber wenn es doch "so einfach" ist, kann mir vielleicht auch jemand einen entsprechend einfachen Tipp auf die Schnelle geben.
Ich gelobe auch, mich fortan tiefer in HTML hineinzuknien.
In genau diesem Moment fange ich damit an!!!

Simon1983

Im Prinzip an der selben Stelle wie der HTML Teil. In den selben Bildertag.

So könnte das dann aussehen. Das wäre dann auch für Firefox und IE vertretbar.

k-ei

@ Simon1983:

DANKE !!!
Das hat mir geholfen, und nun zeigt auch FF 1.5 die Seiten korrekt an!

Und ich habe mal wieder was gelernt

Taz

Den Fehler im Firefox 1.5 kann ich auch bestätigen, leider
Ich hoffe mal dass der Fehler in der nächsten Firefox Version behoben wird...

Simon1983

Zitat von Taz

Den Fehler im Firefox 1.5 kann ich auch bestätigen, leider
Ich hoffe mal dass der Fehler in der nächsten Firefox Version behoben wird...

Der Fehler ist im Quelltext, nicht im Firefox.

Taz

Nein, Firefox 1.5 hat definitiv ein Problem damit!

Hier mal ein Beispiel:
Quelltext:

Code

<div style="border: 1px solid #000000;">
<img src="http://www.firefox-browser.de/forum/images/smiles/icon_surprised.gif" style="width: 15px; height: 15px; border: none; vertical-align: middle;" />Der Text der neben dem Bild steht, sollte genau mittig zu dem Bild sein!
</div>

Der IE6 und der Opera stellen es richtig da:
Opera:
[Blockierte Grafik: http://pub.ehmig.net/img/firefox-browser.de/0000_opera.jpg]
IE6:
[Blockierte Grafik: http://pub.ehmig.net/img/firefox-browser.de/0000_ie6.jpg]

Beim Firefox hingegen sieht es so aus!
[Blockierte Grafik: http://pub.ehmig.net/img/firefox-browser.de/0000_firefox.jpg]

und das ist nicht richtig!

Gruß
Taz

cubefox

ich kenn mich mit dem thema nicht aus, aber eins weiß ich:
- wenns internet explorer und opera anders machen als der firefox, heißt das noch lange nicht, dass das auch richtig ist.

und wenn das ganze erst seit 1.5 so ist, ists sehr wahrscheinlich, dass es sich um einen bugfix handelt, vermute ich.

Taz

Da magst du im allgemeine schon recht haben, aber nicht in diesem fall!

Firefox 1.5 zeigt das CSS Attribut "vertical-align: middle;" nicht korrekt an!

Zitat

middle == Mittig zwischen den oberen und unteren Rand des Elternelements

und wenn du dir jetzt die bilder noch einmal anschaust, wirst du sehen, das der Text und der Smilie beim Firefox nicht in der mitte sind.

Firefox 1.5, "vertical-align: middle;"
[Blockierte Grafik: http://pub.ehmig.net/img/firefox-browser.de/0000_firefox.jpg]

und so sollte es aussehen
[Blockierte Grafik: http://pub.ehmig.net/img/firefox-browser.de/0000_opera.jpg]

JonHa

Irgendwie hast du recht, das erscheint mir so ziemlich merkwürdig.