Beste Möglichkeit Text an Bild auszurichten?

greydemon

Mir stellt sich eine grundlegende Frage, wenn ich Text an einem Bild ausrichte:

Wie kann ich im Html Editor festlegen, daß der Text neben dem Bild steht?

Und gibt es ein Plugin für den Wysiwyg Editor, mit dem man bequem den Text am Bild ausrichten kann?

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

maxe

Wenn du ein Bild über den WYSIWYG Editor einfügst, bekommst du doch die Möglichkeit die Ausrichtung zu bestimmen:
Ausrichtung:
Keine - Bild steht alleine in einer Zeile linksbündig
Links - Bild steht links, Text steht rechts daneben
Zentriert - Bild steht alleine in einer Zeile zentriert
Rechts - Bild steht rechts, Text steht links daneben

Zusätzlich muss du für diese Ausrichtung aber auch die Formartierungen in der style.css bestimmt haben:

Code

/*********************/
/* Bilder ausrichten */
/*********************/
.aligncenter, div.aligncenter, .centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.alignright {
    float: right;
    padding: 4px;
    margin: 0 0 2px 7px;
    display: inline;
}
.alignleft {
    float: left;
    padding: 4px;
    margin: 0 7px 2px 0;
    display: inline;
}

Alles anzeigen

greydemon

Hi, ich habe das jetzt mal versucht - den CSS Code eingefügt und danach
eine Seite angelegt mit Bildern und Text.

Der Text sollte eigentlich rechts neben dem Bild stehen. So habe ich es auch im Wysiwyg Editor angelegt. Bilder habe ich links ausgerichtet und Text aus Word mit der Word Funktion des Editors eingefügt.

Nun sieht es aber so aus:

http://www.eskimostar.de/?p=247&preview=true

Text steht unter dem Bild und der Zeilenabstand hat sich ebenfalls verschoben. :?

maxe

Leider kann ich mir deinen Link nicht anschauen, da er wahrscheinlich noch nicht veröffentlicht ist.

Wenn das Bild links stehen soll und der Text rechts, dann füge das Bild - links ausgerichtet - als erstes ein und dann (bitte mal ohne Word versuchen; Word ist fürs Web nicht wirklich gut geeignet ;) ) den Text daneben.

greydemon

sorry, jetzt ist die seite online:

General

ich habs jetzt ohne word gemacht. der text steht wiederum unter dem bild.

und eigentlich gibt es doch diese copy from words funktion, damit man texte besser einfügen an, oder?

maxe

also bei mir im FF3 steht der Text rechts neben den Bildern:

greydemon

Also, bei mir steht der Text:

- im Firefox unter den Bildern
- im IE und Google Chrome wie bei dir in der Ansicht

Aber die Bilder müßten eigentlich auch beide links ausgerichtet sein. Das zweite Bild ist irgendwie eingerückt.

Könnte es vielleicht an der Themeeinstellung liegen, daß die Seite in jedem Browser ander dargestellt wird? :?

greydemon

Oder schau dir mal den Katalog hier an:

Katalog

Da steht jetzt alles kreuz und quer, obwohl ich es im Editor richtig angeordnet habe. Die Bilder müßten normalerweise alle untereinander stehen (keine Einschiebungen) und der Text neben dem jweiligen Bild. Auch der Zeilenabstand soll normal sein und nicht doppelt.

Bin ein wenig verwirrt.

maxe

Das Problem dabei ist, dass der Text neben dem ersten Bild nicht "lang genug" ist. Daher fängt das 2te Bild auch noch rechts neben dem ersten Bild an. Da musst du irgendwie gucken, dass der Text zu dem Bild passt.

Der Zeilenabstand kommt hier her:

Code

.post p {style.css (Linie 395)
margin:0 0 14px;
padding:0;
}

maxe

Noch was: Warum machst du für Deinen Katalog nicht einfach eine Kategorie "Katalog" mit den einzelnen Artikeln? Dann wär das Problem mit dem ausrichten nicht mehr ganz so schlimm.

nepf

Zitat von maxe

Das Problem dabei ist, dass der Text neben dem ersten Bild nicht "lang genug" ist. Daher fängt das 2te Bild auch noch rechts neben dem ersten Bild an. Da musst du irgendwie gucken, dass der Text zu dem Bild passt.

Genau an dem Problem sitze ich auch immer und immer wieder.

Ich brauches das auch, dass etliche Bilder immer schön links sitzen und das der Text dazu immer hübsch rechts neben dem Bild sitzt - und bei mir ist der Text eben oft viel weniger hoch, als das Bild.

Mit einer Tabelle will ich das ja nun nicht lösen müssen, aber wie geht das denn css-mäßig?

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Beste Möglichkeit Text an Bild auszurichten?

Jetzt mitmachen!