Wierd horizontal scroll bar.

Looks like that if I have a long text, a scroll bar appears right below the text block, see below image:

While for IDE like VSCode, it appears on the text editor.

How can I achieve the same behavior with code mirror?

It seems if the line numbers can take up the full space even with no content is there, there will not be such a problem , but how?

The demo on the website does not behave this way, so I think you have some problem with your CSS or the way the editor is nested in another scrollable element.

Thanks for the pointer @marijn . I took a look at the demo and found that I need to set a max-height on “.CodeMirror-scroll” class.