CSS:: Fokus der Elemente in contenteditable

Wenn Sie folgendes HTML haben:

<div contenteditable="true">
  <p>The first paragraph</p>
  <p>The second paragraph</p>
</div>

Gibt es eine Möglichkeit, den Absatz, der bearbeitet wird, anders zu gestalten als alle anderen Absätze in derdiv das istcontenteditable?

div > p:focus { border: 1px solid red }

wird nicht auf den zu bearbeitenden Absatz angewendet.

Hier ist einJSFiddle du kannst damit spielen.

Wie kann ich das stylen?Absatz wird bearbeitet (das<p>-tag) anders?

Ich würde eine reine CSS-Lösung bevorzugen, aber vielleicht muss ich JavaScript verwenden.

BEARBEITEN:

Da konnten wir keine reine CSS-Lösung finden (und verwenden:hover ist für mich keine echte Lösung) Ich suche jetzt nach einigen JavaScript-Zeilen, die das Attribut setzenclass="focus" auf dem Knoten, der bearbeitet wird.

Antworten auf die Frage(3)

Ihre Antwort auf die Frage