Bild IM Text umfließen lassen

[Lenchen]

Hallo
Ich habe mal wieder eine Frage. Auf meiner Seite soll es zu den Produkten auch eine Anleitung geben. Im Text habe ich Mini-Bilder als Thumbnails (ich hoffe es ist richtig geschrieben) eingefügt. Ich möchte jetzt, dass diese Bilder vom Text umflossen werden, allerdings möchte ich sie nicht an den Rand rücken, sondern im Text lassen. Gibt es noch einen Befehl, außer Float:right bzw. float:left, so dass die Bilder an der Stelle bleiben können, an der sie sind?
LG

 

[prm]

Bilder in der Mitte und von Text umfließen lassen - dazu ist mir keine Lösung bekannt. :sad:
Allenfalls seitlich,
Fließtext um Grafiken
Text zu Bildern anordnen

aber das war nicht deine Frage.

 

[Lenchen]

wie gesagt rechts und links weiß ich, ich möchte allerdings die Bilder an ihrer Stelle im Text behalten. Sie rücken halt im Moment die Zeilen etwas auseinander, was nicht so schön aussieht, aber zu not lass ich es so.

 

[threadi]

Dafür gibt es bisher keine CSS-Eigenschaften. Man kann das höchstens selbst basteln indem man den Text in 2 Spalten teilt und das Bild dazwischen unterbringt (ich würde vorschlagen es auch zu teilen, pro Spalte ein Teil).

 

[Lenchen]

Hmm... schade. Das teilen in 2 Spalten bringt mich auch nicht wirklich weiter, da ich relativ viele Bilder habe, die ich in den Fließtext mit einbinden will. Ich werde dann wohl mit den kleinen "ausrückern" des Textes leben.
Oder ich vergrößer die Schrift, so dass es nicht so auffällt.
Danke für die Hilfe.

 

[neuroleptika]

Ich kann mir das irgendwie nicht vorstellen.
Wie groß sind denn die Bider in px?
Hast du so etwas schon irgendwo gesehen?

 

[Lenchen]

hmm, ok es ist folgendermaßen.
Häufig, wenn man im Internet etwas suht, was man basteln/bauen möchte ist es folgendermaßen: Man findet eine Anleitung ohne Bilder oder nur mit sehr wenigen oder schlecht aufgelösten und versteht nur die Hälfte. Also sucht man weiter und findet eine Seite mit Bildern, die allerdings alle fast Bildschirmfüllend sind, man es sehr schwer hat, eine stelle im Text wiederzufinden, weil man x Bilder durch die Gegend scrollen muss. Außerdem hat diese Seite dann häufig eine Irre Ladezeit.
Meine Idee war jetzt folgende: Die Anleitung schreibe ich ganz normal und füge die Bilder als Mini-Thumbnails (Breite ist 50px, Höhe unterschiedlich) ein. Man kann noch ungefähr erkennen, was auf dem Bild ist, Es ist genau dort, wo es vom zusammenhang her hingehört und wenn man Details will kann man es sich größer ansehen.
So wie auf dem Screen sieht es momentan aus. Ich wollte das ganze halt etwas "ordentlicher"

 

[neuroleptika]

Hm,
und die Bildchen sollen sich vertikal zentriert der Zeilenhöhe anpassen?
Das würde mit background-images schon gehen.
Der angezeigte Ausschnitt würde mit der jeweiligen Schriftgröße mitwachsen.
Wenn die Schrift groß genug ist, sieht das vielleicht sogar gut aus.

 

[prm]

Das kommt auf deine bisherige Lösung raus:

#content {
font: 14px verdana,
}
#content img {
width:25px;
height: 25px;
position: relative;
top: 8px;
}

<div id="content">
Dies ist eine Textzeile mit einem Bild <img src="thumb1.gif"> zwischendrin.<br>
Dies ist eine Textzeile <img src="thumb2.gif"> mit einem Bild zwischendrin.<br>
</div>

Allerdings wirkt das äußerst unruhig.

Ich würde jedem Bild einen entsprechenden Textabsatz zuweisen und das Bild dann links oder rechts floaten.