Button inside border using CSS
<p>How can I make a button with an inner border, where if I hover over the button, the inner border will shrink?</p>

<p><img src="https://i.stack.imgur.com/ocVGF.png]" alt="f"></p>

<pre><code>.btnTest {
    color: #f5f5f5;
    background-color: #000000;
    -webkit-border-radius: 1;
    -moz-border-radius: 1;
    border-radius: 1px;
    /*border: 0;*/
    border-bottom: 3px solid green;
    /*-webkit-border-radius: 0;
    -moz-border-radius: 2;
    border-radius: 2px;*/
}

.btnTest:hover {
    color: #f5f5f5;
    background-color: #000000;

    -webkit-border-radius: 1;
    -moz-border-radius: 1;
    border-radius: 1px;

    border-bottom: 2px solid green;
    margin-bottom: 1px;
    /*border-bottom: 3px solid transparent;*/
}
</code></pre>