Flexbox image in link not working

I have an image, which is 1039x1039 in a link... Something like this:

HTML:

<a href="#"><img src"img.png" alt="alt"></a>

CSS:

img {
    align-self: center;

    height: 100%;
    width: auto;
    border: none;
    }
a {
    flex: 0 0 0;
}

Of course the container is set to display:flex. The problem is that when I load the page the img is rescaled to 80x80 but the link is 1039x80. Only after clicking the link it rescales to 80x80. It's like flexbox checks for the img width after refreshing the styles? Any thoughts?