Image in top right of other image?

I tried the following html:

<div style="text-align: center;">
<a href="https://example.com"><img src="image.png"></a>
<a href="https://example2.com" style="top: 0px; right: 0px;"><img src="logo.png" style="width: 20px; height: 20px;"></a>
</div>

What I was trying to accomplish was that the second link element, which contains an image, to be in the top right of the first image. However, the smaller image stays on the outside of the other one. Is there any possible way this could be done with the same layout? If not, then please tell me how I could make it work.