Text und Icons auf gleiche Höhe bringen

JavaUncle

Mitglied
Jedes mal, wenn man in einem Text in IMG-Tag für ein Icon platziert, hängt das Icon fast am unteren Teil des Textes, und der Text verrutscht leicht nach oben. Das sieht *ziemlich* uncool aus.

Wie kann ich die Incons und den Text so positionieren, das die Icons auf Höhe der Textzeile stehen und nicht halb darunter? Kann ja nicht jedes mal mit position:relative und top:-4px; herum frickeln...oder muss ich das?
 
ich würde es so machen:
HTML:
<div id="1">
   <div id="2"><img></div>
   <div id="3">Text</div>
</div>
und die Div's könntest du dann ausrichten. Falls dass in eine Schleife geschrieben wird dann würde ich id austauschen gegen class.
 
Das funktioniert aber nicht bei Fließtext, in dem Icons auftauchen sollen!

Ich erinnere mich ganz dunkel daran, das es eine CSS-Eigenschaft gab, die die Positionierung relativ zur Textzeile angibt. So etwas in der Art. Da war mal was.
 
Wie soll es denn aussehen? Hast du mal ne Skizze oder sowas?

Ich glaub es würde auch funktionieren wenn du jedem <img> ein class gibst und dann per CSS denn Abstand nach oben einstellst. Bin aber nicht sicher , musst du halt ausprobieren
 
nein, das funktioniert nicht richtig. zerreisst den textfluss komplett. der Zeilenabstand des Textes ist riesig, weil das Bild so hinunter ragt. das icon ist so hoch wie der Text, und soll einfach mit dem Text auf gleicher Höhe sein.
 
Zurück