Today I spent time working with CodeMirror to build a specific environment for editing PHP code stored in a secure database. Everything is functioning properly - the editor, code highlighting, indent tabs - except for one issue that has been bothering me. When the code within my CodeMirror textarea exceeds the length of the textarea, it disappears off the screen (refer to the screenshot at the end of this post).
I am seeking a solution where the code can continue on a new line below without adding an extra line number. Is this a common problem and is there an easy fix available?
View the screenshot here: http://www.example.com/codemirror.png
Thank you for any help provided.
//Edit: issue resolved
I have successfully solved the problem by making adjustments to the CSS file. For those interested, here is the fix:
.CodeMirror {
overflow-y: auto;
overflow-x: scroll;
width: 700px;
height: auto;
line-height: 1em;
font-family: monospace;
_position: relative; /* IE6 hack */
}
By setting overflow-y to auto (allowing the height to adjust automatically), using overflow-x to scroll (preventing CodeMirror from exceeding the textarea's width), and specifying a fixed width, the issue was resolved. You can also add a max-height, but may need to set overflow-y to scroll as well in that case.