question - outline on adjacent elements

by spiderplant0

HTML

<div id="container">
    <a href=""><img src="../img/logo.png"></a>
    <a href=""><img src="../img/logo.png"></a>
    <a href=""><img src="../img/logo.png"></a>
</div>

CSS

#container {
    overflow: hidden;
    padding: 10px;
}

a:link, a:visited, a:active, a:hover, a:focus {
    text-decoration: none;
}
    
a {
    margin: 0;
    padding: 0;
    border: 0;
    float: left;
}

a > img {
    margin: 0;
    padding: 0;
    border: 0;
    width: 40px; height: 40px;
    background-color: pink;
}

a:hover {
    outline: 3px dotted blue;
}