Menu
How do I make a CodeMirror editor and its gutter 100% of the height of its parent?
For example, on jsfiddle, the editors have a 100% height gray gutter.
I've gone through the CSS trying to make everything 100% height, but no effect.
427
By setting an editor's height style to auto and giving the viewportMargin a value of Infinity , CodeMirror can be made to automatically resize to fit its content.
Example: Gutters The view module provides functionality for adding gutters (vertical bars in front of the code) to your editor. The simplest use of gutters is to simply dump lineNumbers() into your configuration to get a line number gutter.
Download CodeMirror files. Download jQuery file. Inside the codemirror project folder create subfolders and name them js, css and plugin. The js folder will hold all the javascript files.
This could be used to, for example, replace a textarea with a real editor: var myCodeMirror = CodeMirror(function(elt) { myTextArea. parentNode. replaceChild(elt, myTextArea); }, {value: myTextArea.
A CSS rule like .CodeMirror { height: 100%; } should work. Note that when the parent element changes size after the editor has been initialized, you are responsible for calling .refresh() on your CodeMirror instance to make sure it correctly draws itself.
64
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
