Placeholder doesn't disappear upon focus in Chrome
I came across the same problem today and I came up with a pure-CSS solution hack:
input:focus::-webkit-input-placeholder { color: transparent;}
Firefox and chrome(and safari) act different on HTML5 placeholders. If you want chrome to disappear the placeholders on focus, you can use following script:
$('input:text, textarea').each(function(){ var $this = $(this); $this.data('placeholder', $this.attr('placeholder')) .focus(function(){$this.removeAttr('placeholder');}) .blur(function(){$this.attr('placeholder', $this.data('placeholder'));});});
You can use this placeholder jquery plugin: placeholderFix.With this plugin, placeholder tag will work on the same way in all browsers, also in browsers that don't support it.