Text neben Bild ausrichten

Hallo Freunde,

Ich editiere gerade eine Webseite, auf der Downloads nach diesem Schema angeboten werden: Beschreibung .

Mein Problem ist, dass Bild und Text vertikal nicht zentriert, auf gleicher Höhe sind.

Das sieht dann so aus:
http://img180.imageshack.us/img180/3752/screenxr.jpg

Das Problem ist, dass der Text immer weiter ein Stückchen weiter unten ist als er soll. Der Downloadbutton ist genau passend zugeschnitten. Es ist also nicht so, dass am unteren Bildrand noch einige Reihen weißer Pixel sitzen.

Ich verwende folgenden HTML Code, um das Ganze anzuzeigen:

Technische Daten: 

Weiß jemand von euch, wie man das beheben kann ?

MfG

RW

Moin,

Mein Problem ist, dass Bild und Text vertikal nicht zentriert,
auf gleicher Höhe sind.

Text und Bilder sind immer auf einer Linie. Möglicherweise hat Dein Bild unten zu viele leere Pixel. Unterlängen ragen über diese gedachte Linie hinaus.

Es könnte helfen, das Bild (warum ist das „Download“ überhaupt ein Bild?) als Hintergrundbild einzubinden (diese Kugel als Hintergrundbild, den Text als Text und nicht als Image). Da kannst Du dann ja die Position mit background-position besonders festlegen.

Es ist also nicht so, dass am unteren
Bildrand noch einige Reihen weißer Pixel sitzen.

Okay, dann nicht. Hättest Du einen Link eingestellt statt eines Bildes, hätte man das sofort sehen können. Bilder sind meist nicht wirklich aussagekräftig.

Ich verwende folgenden HTML Code, um das Ganze anzuzeigen:
Technische Daten: 

Ich nehme an, das -Tag war ein Versuch, dem Forum bekannt zu machen, dass es sich um Code handelt. Anders wäre das natürlich semantisch falsch.
Beim -Tag fehlt das Pflicht-Attribut „alt“. Mit diesem Alternativtext musst Du Deine Ausgabe dann natürlich nochmal prüfen, das kann dann wieder ganz anders aussehen.

Weiß jemand von euch, wie man das beheben kann ?

Hilft das schonmal weiter?

Grüße,
-Efchen

hallo freund,

Technische Daten: 
Weiß jemand von euch, wie man das beheben kann ?

z.b. im img-tag einfügen:

style=„margin-bottom:-1px;border:0px“

gruß
klaus

Hallo Efchen,

Erstmal Danke für die Ratschläge.
Ich kann die Page nicht einfach so ins Netz stellen, weil sie Teil eines Joomla CMS ist und ich keinen im Internet verfügbaren Server zur Hand habe.

Die Links haben in Wirklichkeit ein Alt-Tag und auch ein deutlich längeres href. Ich hab diese nur gekürzt, damit sie besser hier besser lesbar sind und sich nicht um drei Zeilen schlängeln.

Ich hätte nicht gedacht, dass sich das Alt-Tag auf die grafische Positionierung der Elemente auswirkt. Das wäre auch irgendwie unlogisch. Aber das wäre ja nicht das Einzige, was im Webdesign unlogisch ist :wink:

Moin,

Ich kann die Page nicht einfach so ins Netz stellen, weil sie
Teil eines Joomla CMS ist und ich keinen im Internet
verfügbaren Server zur Hand habe.

Sei mir nicht böse, aber diese „Ausrede“ habe ich schon soooo oft gehört. Stell Dir vor, Du wärest in der Situation des Helfenden und sollst anhand eines bloßen Bildes, das sonstwas zeigen kann, helfen.

Du wirst sicher genauso reagieren und sagen, Du möchtest einen Link zur Seite sehen. Zumal man mit diversen Developer Tools (z.B. Firebug) viele Fehler sofort finden kann. Und sich für solche Zwecke irgendwo einen Webspace zuzulegen (sowas gibts ja auch kostenlos!), damit man bei Fragen die Beispielsseite direkt hochladen kann, ist ja wohl eigentlich eine Kleinigkeit.

Ich bin ja auch nicht böse deswegen, es langweilt mich nur immer wieder, diese „Ausrede“ zu lesen. Nimm das als Rat fürs nächste Mal mit. Und das gilt auch für alle anderen, die Hilfe wollen…vielleicht lesen ja noch mehr mit.

Die Links haben in Wirklichkeit ein Alt-Tag

Ein alt-Attribut, meinst Du!?

Ich hätte nicht gedacht, dass sich das Alt-Tag auf die
grafische Positionierung der Elemente auswirkt.

Tut es ja auch nicht. Aber auch die Darstellung bei deaktivierten Grafiken bzw. Textbrowsern. So ein Alternativtext hat in der Regel nicht die selbe Länge, wie das Image. Und das hat schon so manche Anzeige durcheinander gebracht.

Aber das wäre ja nicht das Einzige, was
im Webdesign unlogisch ist :wink:

Eigentlich ist da alles ziemlich logisch. Voraussetzung dafür ist, dass man HTML begriffen hat (das haben leider sehr viele, die das von sich behaupten eben nicht!) und Inhalt strikt von Layout trennt. Dann ist alles sehr einfach und sehr logisch.

Probleme bereiten nur die unzureichenden Umsetzungen der Standards in den Browsern. Aber das hat nichts mit der Logik des Webdesigns an sich zu tun.

Liebe Grüße,
-Efchen

1 Like