Has anyone found a more effective way to limit the height of CKEditor 5 when using it with React? By default, it adjusts its height based on the content, which can be problematic in situations where there is a lot of content. This causes the editor to extend beyond the bottom of the screen, requiring users to scroll down to view all the content. Unfortunately, this often results in the toolbar becoming hidden. To address this issue, I have implemented a max-height property in CSS, like so:
.ck-editor__editable {
min-height: 20vw;
max-height: 37vw;
resize: both;
}
While this solution works well for fullscreen windows, it falls short on 4K monitors where the editor appears very small. Additionally, using a FullScreen plugin alongside the max-height attribute restricts the editor's height even in fullscreen mode, rendering the feature useless.
I am seeking alternative methods for sizing the editor to occupy most of the window's height without causing scrolling and enabling FullScreen mode to function properly. Any suggestions or ideas would be greatly appreciated!