Remove 3 pixels in iOS/WebKit textarea

Question

I\'m trying to create a textarea that looks exactly like a div.

However, on iOS there\'s 3 pixels coming from somewhere that I can\'t remove.

Answer 1

Here's a quick JavaScript solution (based on stslavik's approach) that saves some code lines and tests for iPad and iPod as well.

If you use jQuery:

if(/iPhone|iPad|iPod/i.test(navigator.userAgent)){
  $('textarea').css('text-indent', '-3px');
}

If you want to use standard JS:

if(/iPhone|iPad|iPod/i.test(navigator.userAgent)){
  textareas = document.getElementsByTagName('textarea');
  for(i = 0; i < textareas.length; i++){
    textareas[i].style['text-indent'] = '-3px';
  }
}