Search code examples
javascriptjqueryhtmlcssckeditor

How to stop inline ckeditor div resizing


I have a div with contenteditable set to true and I am making editable with an inline CKEditor instance.

As I type in the div, it naturally grows in the vertical direction as the text fills up or when I press return.

If I set the height and max-height CSS of the editor div then, the div itself doesn't grow BUT the editor carries on letting me enter text all the way down the page (it breaks out of the div).

What I want to be able to do is lock the inline editor area to, say, 100px in height and, ideally, not allow any more lines to be inserted.

Any ideas much appreciated.


Solution

  • After some playing around I found the answer and it was simple. Just apply a height and overflow-y:auto to the css of the containing div. Works a treat :)