after selecting date how to remove X mark(clear button) in html 5 [input type="date"]

Question

I know this may seems duplicate question but I still not get clear idea about the clear button in firefox and up/down arrows in chrome. It occupies more space in my table. I want to remove those functions. I really don't know is there any function in javascript or in CSS I tried this:

input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

but, still getting the same X mark.

Answer 1

In Chrome you can use

input[type="date"]::-webkit-inner-spin-button,    
input[type="date"]::-webkit-clear-button { display: none; }

Firefox, on the other hand, doesn't have support for this.

You'd probably be better off using a 3rd party jQuery plugin.