Tiny MCE editor height problem on iOS devices

Question

The only issue is : when i open the Editor on iOS device and hit "return" key, its increases the height of editor. It doesnt happen on PC. I applied css max-height property & parameters in tinymce editor autoresize_max_height . But nothing works

Link >> codepen.io/anon/pen/LJLveG

Any help!

Answer 1

This is the source I see in your codepen:

#1: https://cloud.tinymce.com/stable/tinymce.min.js

But this is the one that is referred to in the Mobile version:

#2: https://cloud.tinymce.com/dev/tinymce.min.js

With additional mobile settings (default shown here):

tinymce.init({
  selector:'textarea',
  theme: 'modern',
  mobile: {
    plugins: 'autosave autolink lists'
  }
});

There is also a Resize option:

"This option gives you the ability to disable the resize handle or set it to resize both horizontal and vertically. The option can be true, false or the string 'both'. False disables the resize, true enables vertical resizing only, 'both' makes it possible to resize in both directions horizontal and vertical."

resize: true|false|'both'

Can't say that it had any effect on iOS.

Well, TinyMCE has a tendency to drop the first link (#1) everywhere in their pages and even in the mobile section, except for the one place where the specify the source for the Mobile version they use the second link (#2).

I see that you have set max_height to 300px. I guess it could be a problem that the Editor is actually about 400 pixels high.

Can't say that either of them work very well with iOS, as it's somehow full of bumbs on the road, suddenly scroll stop midway and refuse to continue until the Editor somehow catches up with events and recalculates the space and then you can continue until the next bumb. It's never really complete. Perhaps the Mobile version just doesn't play well with Codepen or that iPhone 6 I was using to check this page is just too old for this exercise.