22

It seems that the contenteditable attribute (which worked fine on iOS6) has stopped working on iOS7 webkit. Though the browser seems to recognize the field as editable, and brings up the keyboard, any input seems to close it, or it fails to register. Any encounter the same problem, or have any workarounds?

You can try it out over here - http://html5demos.com/contenteditable

Thanks!

tangential
  • 221
  • 1
  • 2
  • 4

2 Answers2

37

I ran into this problem today. The solution for me was to set user-select to "text" in the CSS for any editable elements:

* {
    -webkit-user-select: none;
    user-select: none;
}

input,
textarea,
[contenteditable] {
    -webkit-user-select: text;
    user-select: text;
}
Jason P
  • 371
  • 3
  • 3
  • Confirmed this is still required for iOS 10, when setting the `user-select` property globally. – Tim Nov 11 '16 at 20:51
  • * Confirmed this is still required for iOS 10 in September of 2017 - No updates have changed this. Hopefully iOS 11 is different. Great find/fix @Jason P – MattOlivos Sep 18 '17 at 01:45
  • I still needed to add -webkit-user-select: text on iOS 13.3 – Tom Jan 22 '20 at 22:22
5

I was having the same issue and the below link helped me resolve it.

https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariCSSRef/Articles/StandardCSSProperties.html#//apple_ref/doc/uid/TP30001266-SW1

The solution that worked for me was to set "-webkit-user-modify" property to "read-write" for any editable element (you have defined as contenteditable)

*{
    -webkit-user-modify:read-write;
}
Poonam
  • 81
  • 1
  • 2