Heads up! This blog post hasn't been updated in over 2 years. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Get in touch with support if you have further questions.
Code in the editor wraps here on CodePen. If there is too much code to fit on a line, it wraps down to the next line. Like any code editor, the line is still treated as a single line. That means you can double click it to select the whole thing, and white-space sensitive languages treat it as one line.
But until recently, wrapped lines would begin at the very beginning of the line, all the way to the left of the editor. That was a little annoying, since the whole point of indentation is visual organization and artificial hierarchy.
That’s fixed now! Lines now wrap at the current indentation level. See:
Much more readable, we think. Let us know if you have any issues with it.
At the moment we don’t have any plans to stop wrapping. But if you really hate it, you can always run a terminal command to force the editor to not wrap:
// For the HTML Editor HTMLEditor.editor.setOption("lineWrapping", false); // For the CSS Editor CSSEditor.editor.setOption("lineWrapping", false); // For the JS Editor JSEditor.editor.setOption("lineWrapping", false);