Anzeige zwei divs auf die gleiche Linie ohne blankspace in zwischen, innerhalb eines div mit contenteditable="true"

<div id="test" class="pad" contenteditable="true">
  <div id="a" class="fif">text1</div>
  <div id="b" class="fif">text2</div>
</div>  

Wie im obigen code habe ich eine contenteditable div und viele divs drin (child-divs). Anzahl von child-divs dynamisch variieren und auch den Inhalt zwischen die div-tags. Ich will text1 und text2 (d.h. Inhalt zwischen die div-tags) werden angezeigt auf der gleichen Zeile, ohne Leerzeichen dazwischen. Auch während der Eingabe in contenteditable div, wenn ich drücken Sie die ENTER-Taste, es sollte mit der nächsten Zeile.

Versuchte ich float:left aber es hat mir nicht erlauben, gehen Sie auf die nächste Zeile, wenn ich drücken Sie die ENTER-Taste während der Eingabe in contenteditable div. display:inline, span wenn verwendet, zeigen leere Raum zwischen 2 div-Inhalt. Ich habe versucht, mit flex aus http://www.w3.org/TR/css3-flexbox/ aber nicht den gewünschten Ausgang.

Ausgangspunkt fiddle: jsfiddle.net/UwZsm
Vielen Dank für die Antwort, aber dennoch bleibt es eine Leerstelle zwischen 2 divs class="fif", die ich nicht will.

InformationsquelleAutor Vivek Dani | 2013-03-01

Schreibe einen Kommentar