Summernote edit not displaying scroll bars

Question

I am using summernote in a bootstrap modal and set it up as follows:

 $('.summernote').summernote({
     toolbar: [
        ['style', ['bold', 'italic', 'underline', 'clear','fontname']],
        ['color', ['color']],
        ['fontsize', ['fontsize']],
        ['height', ['height']],
        ['style', ['style']],
        ['para', ['ul', 'ol', 'paragraph']],  
        ['misc', ['fullscreen','undo','redo']],
        ['table', ['table']]
    ]
    }); 

The problems is that no scroll bar appears when I am entering text into the edit area and go below the bottom of the edit area as in:

What is needed to have the scroll bars appear and constrain the text to stay within the lines?

Answer 1

Documentation for Summernote says:

height : String/Number (optional)

set editor height (e.g. 300px)

Defaults to: null

So, solution is:

$('.summernote').summernote({
    height: '300px',
    toolbar: [
        ['style', ['bold', 'italic', 'underline', 'clear','fontname']],
        ['color', ['color']],
        ['fontsize', ['fontsize']],
        ['height', ['height']],
        ['style', ['style']],
        ['para', ['ul', 'ol', 'paragraph']],  
        ['misc', ['fullscreen','undo','redo']],
        ['table', ['table']]
    ]
});