add style's to the textarea 's specific line

Problem

I have html textarea dynamically it's content changing line by line. I want to add some styles to the updated or modified line content. Is there any windows selection, like properties, to do it??

What I want is make user feel, that the change has happen. Or any other way to achieve it?

Problem courtesy of: aarav

Solution

There is no simple way to achieve it just by CSS with textarea, but the problem is solvable for sure :)

  • you can replace textarea with <div contenteditable><p></p></div>
  • you can set textarea CSS: background: transparent and manipulate some element below the textarea
  • you can modify this jQuery plugin: https://github.com/cotenoni/jquery-linedtextarea to manipulate specific lines (some CSS work required, cause by default you can manipulate just left column)
  • you can set custom background for textarea and move it up and down to specific line by background-position: 0 X
Solution courtesy of: Cezary Daniel Nowak

Discussion

There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.