How to set the padding of placeholder text

Question

I'm using an input tag and have set a placeholder value in it. Now, I want to set the padding for the placeholder text inside it, but I can't.

Here is what I've tried:

HTML

<form><input class="tbsearchbar" type="search" name="search_tb" placeholder="Test"></form>

CSS

placeholder {
    padding-top: 10px;
}

Answer 1

This works (tested on Chrome):

#yourid::placeholder {
    padding-left: 3px;
}

For all browsers:

#yourid::-webkit-input-placeholder { /* Chrome/Opera/Safari */
   padding-left: 3px;
}
#yourid::-moz-placeholder { /* Firefox 19+ */
   padding-left: 3px;
}
#yourid:-ms-input-placeholder { /* IE 10+ */
   padding-left: 3px;
}
#yourid:-moz-placeholder { /* Firefox 18- */
   padding-left: 3px;
}