RESOLVED FIXED 181364
Caret offset when placing an iframe in a fixed position div on iOS 
https://bugs.webkit.org/show_bug.cgi?id=181364
Summary Caret offset when placing an iframe in a fixed position div on iOS
Samuel Tai
Reported 2018-01-06 07:18:31 PST
Created attachment 330639 [details] Error Page I tried to create a fixed position div and place a read-write iframe on it. It works fine on desktop browsers. However, when it comes to iOS browsers, such as Safari and Google Chrome, both browsers show offset caret position after scrolling the page down. The caret is not stick to the input position. Example Code as below. How can I avoid the caret offset while keep using position:fixed div as a container? <div id="container" style="position: fixed; top: 100px; left: 100px; z-index: 1000;"> <iframe id="ifr" style="background: #FFF;"></iframe> </div> <script> var html_string= '<html><head></head><body style="-webkit-user-modify: read-write;"></body></html>'; document.getElementById('ifr').src = "data:text/html;charset=utf-8," + escape(html_string); </script> <p style="line-height: 1500px;"></p>
Attachments
Error Page (395 bytes, text/html)
2018-01-06 07:18 PST, Samuel Tai 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Pavel
Comment 1 2018-03-27 05:33:10 PDT
Have the same issue: Live example: http://jsbin.com/nujayigone/edit?html,css,js,console Conditions: long form with inputs inside an iframe, iframe itself is inside modal with fixed position. Though if modal is absolutely positioned, the bug is present as well. Bug is reproduced when you scroll the form and try to fill an input. On the very first input everything is fine. iOS 11.1, browser Safari.
Samuel Tai
Comment 2 2018-10-08 02:45:03 PDT
I have checked on ios12, this issue has been fixed.
Note You need to log in before you can comment on or make changes to this bug.