CSS Styling for anchor tag is not working
<p>I have placed some links on a page added a css file to the html one, but the styling is not showing up.</p>

<p>HTML:</p>

<pre><code>&lt;%@page contentType="text/html" pageEncoding="UTF-8"%&gt;
&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
        &lt;title&gt;Title&lt;/title&gt;
        &lt;link rel="stylesheet" type="text/css" href="formatter.css"&gt;
    &lt;/head&gt;
    &lt;body&gt;
        &lt;h1&gt;Welcome&lt;/h1&gt;
        &lt;hr/&gt;
        &lt;div class="anch" style="text-align: center"&gt;
            &lt;a href="admin_login.jsp" style="" &gt;Admin&lt;/a&gt;
            &lt;a href="user_login.jsp"&gt;User&lt;/a&gt;
        &lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>formatter.css:</p>

<pre><code>body{
    font-family: Verdana, Arial, sans-serif;
    color: #555;
    background-color: silver;
}
h1{
    text-align: center;
}
.anch a:link, a:visited{
    text-decoration: none;
    display: inline-block;
    color: black;
    background-color: white;
}
.anch a:hover, a:focus, a:active{
    text-decoration: none;
    display: inline-block;
    color: white;
    background-color: black;
}
</code></pre>

<p>When the above file is run, the body and h1 styles are visible but the anchor styles are not showing up. They appear in their default form (blue and underlined).
Here is an image of what shows up:</p>

<p><a href="https://i.stack.imgur.com/zqHUF.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/zqHUF.jpg" alt="enter image description here"></a></p>