gistfile1.md

This is an elaboration on a successful but ungainly technique to hide the blinking blue cursor in Safari on iOS 9.2.1, where I inject a newline at the beginning of a textarea that's less than one line and scroll to the top, so that the cursor is always out of view: http://jsbin.com/cohema/edit?css,js,output

It appears that I have to inject a newline, my other attempts to insert more space than the textarea is tall/wide some cause the textarea to increase in height/width until a bit of the blinking blue cursor "peeks out", even if that violates the height/width that I set:

• 
  (I've made the textarea not-quite-transparent, being able to see its boundaries helps explain what's happening.)
  In order from left-to-right, those are what happens when I set:
  • padding-top: 20px greater than the height: 10px. Notice how much taller the textarea is than the 20px-tall green span it's right next to; it's not respecting the box-sizing: border-box at all
  • padding-left: 20px greater than the width: 10px
  • text-indent: -10px which is much more negative than the blinking blue cursor is wide
  • text-indent: 20px greater than the width: 10px (notice that without the padding, the width of the textarea is actually something like half the height of the 20px-tall green span)
• I get similar results trying to set the width with absolute positioning:
  
  That second one is what happens with overflow: hidden to remind us how fucked this is. The textarea knows it's only supposed to be 20px by 20px but it sticks out anyway; and even if it gets clipped, the iOS blinking blue cursor gets drawn there anyway.