Home>

When I changed to chrome83, the clear button of input[type=date] that was displayed before disappeared, so
I want to clear the date by displaying the input[type=date] clear button.
I found a way to hide it in css, but I didn't know how to make it visible.

input[type=date]::-webkit-clear-button {
  -webkit-appearance: none;
}


Add HTML.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<input type="date"></input>
</body>
</html>

When shadowDOM is turned ON with the developer tool of chrome83 and the above input tag is confirmed,
-The webkit-clear-button element didn't seem to exist.
Is it difficult to enable the clear function with css?
I would appreciate it if you could teach me.

  • Answer # 1

    As one of the improvements to the form control made in Chrome 83, the design change was made to make it easier to operate even on the touch screen, so I think the clear button itself does not exist.