Question

I am using a work-around for HTML5 placeholder using jQuery. The only problem is that if I click on the placeholder <span> itself, the input field doesn’t become active. For it to become active I have to click inside the input but outside of the placeholder.

Here is a jsFiddle showing what’s going on: http://jsfiddle.net/QXeQy/1/

If I give the span a negative z-index it disappears. How can I fix this?

Answer 1

Your span is in the way of your input. Try adding this:

$("span.holder").click(function() {
    $(this).next().focus();
});

http://jsfiddle.net/QXeQy/2/