JSFiddle - React, Tailwind, and code Playground
HTML
<h1>Stealing 0.5px from margin on hover</h1>
Set system scaling to 100%, and hover the boxes below:<br>
<icon></icon><icon></icon><icon></icon><br>
<icon></icon><icon></icon><icon></icon><br>
<icon></icon><icon></icon><icon></icon><br>
<icon></icon><icon></icon><icon></icon><br>
CSS
icon {
margin: 0.5px;
height: 50px;
width: 50px;
background: lime;
display: inline-block;
}
icon:hover {
border: 0.5px solid gray;
margin: 0px;
}