<a href="#" class="border-button"> Hover me </a>
<a href="#" class="border-button"> Hover me, also </a>
.border-button {
margin: 0.5em; /* Increased margin since the outline expands outside the element */
outline: solid 5px @border;
transition: outline 0.6s linear;
}
.border-button:hover { outline-width: 10px; }
View Compiled
This Pen doesn't use any external JavaScript resources.