webkit css pseudo elements for time field

Question

I've found an interesting post about webkit pseudo elements for inputs here, so I was going to remove the cancel button from input type="time". But by murthy's law exactly this pseudo element is not described anywhere.

P.S. I already tryed

::-webkit-search-cancel-button
::-webkit-input-cancel-button 
::-webkit-time-cancel-button
::-webkit-time-cancel-button

Of course there is a way to do this with :after element, but I don't believe there is no pseudo element for this

input[type="time"]::after
{
    content: "";
    background: #FFF;
    height: 20px;
    width: 10px;
    position: absolute;
    margin: 0 -10px;
}

Answer 1

That would be ::-webkit-clear-button

So use

input[type="time"]::-webkit-clear-button{
    display:none;
}

To find such things you can enable Show Shadow DOM from the console options, under Elements.

This way when you select the input element, you can open it and look under the hood..

Answer 2

I knew that Internet Explorer 10 supports such a pseudo-element with ::-ms-clear.
So I searched in the source code of Chromium for "webkit-clear" and discovered the presence of ::-webkit-clear-button.

This JSFiddle shows that the ::-webkit-clear-button pseudo-element has the desired effect.

input[type="time"]::-webkit-clear-button {
    display: none;
}