# Textarea mit CKEditor in den Textfluss bringen



## Quest_83 (8. Februar 2015)

Hi Leute,

bin mit meinem Latain am Ende. Ich will eine Textarea die mit CKEditor "formatiert" wurde in den Seiten Textfluss bringen. Ich habe ein Bild das über eine Klasse je rechts und links formatiert wird neben die Textarea gesetzt. Leider wird die Textarea vom Bild teilweise überlagert und ich kann obwohl genug Platz vorhanden ist kein Float oder align left oder right auf die Textarea anwenden. Gibt es da einen Befehl für den CKeditor?

Im Head wird ckeditor.cs eingeladen
<dl>
  <dt>Überschrift</dt>
  <dd>
    <img src="images/bilddatei.jpg" title="Dies ist ein Bild" alt="Bild"/>
    <textarea id="dd0" name="dd[]">Hier steht ein Text</textarea>
    <script>
      CKEDITOR.replace( 'dd0' );
      CKEDITOR.config.width=400;
      CKEDITOR.config.height=125;
    </script>
  </dd>
</dl>

dl und dd sind über css so breit eingestellt das die breite des Textfeldes ohne Probleme reinpasst! Ohne die Formatierung mit dem CKeditor funktioniert die Darstellung einwandfrei!


----------



## SpiceLab (8. Februar 2015)

Gibt es eine Online-Version, um das Problem im Detail analysieren zu können?

Alternativ gerne auch auf http://jsfiddle.net


----------



## Quest_83 (8. Februar 2015)

Nein eine Onlineversion habe ich nicht. Gibt es den eine Option für Float oder align bei ckeditor?


----------



## SpiceLab (8. Februar 2015)

Sieht ganz danach aus 


			
				CKEDITOR.stylesSet hat gesagt.:
			
		

> ```
> // Object Styles{
> name:'Image on Left',
> element:'img',
> ...



Zitat-Quelle: http://docs.ckeditor.com/#!/api/CKEDITOR.stylesSet


----------



## Quest_83 (8. Februar 2015)

Wirkt das auf ein Bild innerhalb des ckeditors oder auf die img's außerhalb des Textfeldes. Ich will die Bilddatei nicht ins Textfeld haben.


----------



## SpiceLab (8. Februar 2015)

Dies bezieht sich auf die eingebetteten Bilder.

Mit einer unsortierten Liste anstelle der Definitionsliste wäre dein Vorhaben ohne größeren Aufwand bzgl. der Umflußeinstellungen (float, align) realisierbar.

```
<ul>
  <li><img ... /></li>
  <li><textarea ...></textarea></li>
</ul>
```


```
ul {margin:0;padding:0;display:table}
li {display:table-cell}
li, li img {vertical-align:top}
```
Das Verhalten deutet darauf hin, dass der CKEditor eine Breite von 100% innerhalb seines Elternelements einnimmt, und sich davon auch nicht abrücken lässt. Eine De-Regulierung der Breite im CSS (z.B. mittels *width:400px !important*) ist mir zumindest nicht gelungen.
[edit]Tipp-Ex[/edit]​


----------



## krug_s (11. Februar 2015)

Hmm hast du CKEditor nur in HTML eingebunden? hmm das kann nachher gar nicht funktionieren.  Du brauchst doch noch PHP ...oder habe ich was falsch verstanden.


----------



## Quest_83 (24. Februar 2015)

Fürs Formatieren in HTML brauche ich zum einbinden kein PHP. Später zum Verarbeiten natürlich. Habe es jetzt mit 2 Div gelöst. Schade das man die Textarea nicht floaten kann. Muss man wieder unnötigen Quellcode reinschreiben. Aber so funktioniert es.


----------

