center an image in a css circle

Keeping your HTML intact and using below CSS class should work.

HTML:

<div class="circletag" id="nay">
    <img src="/images/no.png">
</div>

CSS:

div.circletag {
    display: block;
    width: 40px;
    height: 40px;
    background: #E6E7ED;
    text-align: center;
    align-content: center;
    align-items: center;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
div.circletag>img {
   max-height: 100%;
   max-width: 100%;
}

Use the image as background image.

.circletag {
    display: block;
    width: 40px;
    height: 40px;
    background: #E6E7ED;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    background-image: url(no.png);
    background-position:50% 50%;
    background-repeat:no-repeat;    
}

If you don't want to have the entire outer div to be clickable, this might work:

.circletag {
    display: block;
    width: 40px;
    height: 40px;
    background: #E6E7ED;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;    
    text-align:center;
}

.circletag img{
    margin-top:7px;
}

I think this is the easiest way to make an image centered within a circle

.circletag{
    width: 100px;
    height: 100px;
    padding: 20px;
    border-radius: 50%;
    background-color: #fff;
    line-height: 100px;
    text-align: center;
} 
.circletag img{
    width: 100%;
    height: auto;
    position: relative;
    top: 50%;
    transform: translate(0%, -50%);
}