Pixels stick together in the edge browser after hover, what's the problem with V2.0?

Question

css

In the last question, I already asked such a question, but I could not give a resource
https://jsfiddle.net/uzw87ph3/21/
Here is a simple example, the error is repeated.
It is advisable not to remake Vertska, can you tell me which property creates disgust for me?

Answer 1

Use before or after
https://jsfiddle.net/rfkp0bn1/

.element {
  z-index: 10;
  background: #ccc;
  width: 39px;
  height: 39px;
  margin-top: 1px;
  margin-left: 1px;
   display: flex;
   align-items: center;
   justify-content: center;
  position: relative;
}
.element::before {
 content: "";
 border: 1px solid #000;
 position: absolute;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 display: none;
}
.element:hover::before {
  display: block;
}