CodeMirror : how to limit height in editor

Question

I am using codemirror to show some code on a webpage. But when I initialize the codemirror editor, the height of the editor is way more than the number of lines in the code. Please see this fiddle or below image to understand what I am saying Below is the code to create the codemirror editor.

var myCodeArea = document.getElementById("codeArea");
var myCodeMirror = CodeMirror(function(elt) {
  myCodeArea.parentNode.replaceChild(elt, myCodeArea);
}, {value: myCodeArea.innerHTML,
   lineNumbers:true, mode:"javascript"});

I read codemirror doc but not able to figure out which property controls the height.

Please help me with this

Answer 1

The height can be set through CSS (by giving the .CodeMirror class a height property), or by calling the editor's setSize method.

If you want the editor height to correspond to the height of it's contents, see this demo.