I'm making a search placeholder with which i want animation to be done. I tried , but it's not working.

My css codes are :

@-webkit-keyframes search_types {
from { width:0px;}
to {width:100px;}
}
.input_search_box::-webkit-input-placeholder{
   -webkit-animation: search_types 10s infinite linear;
}

I have tried many ways, transition works but i want to use animation for some other purpose , is there anyway way to do it.
I want to do a type animation like this in the placeholder