After some tinkering, I finally cracked the code. I've successfully integrated icons into a classic webpage layout designed for PC resolutions. The only hurdle left was making sure these icons didn't clutter up the design in responsive mode. So, I quickly whipped up a CSS class to handle this:
@media screen and (max-width: 900px) {
.site_logos {display: none;}
}
With this in place, I applied the class using a div element:
<div class="site_logos">
<p align="right">
<a href="https://www.facebook.com/zaplata.sk" target="_blank"><img style="margin : 1.5px 20px" src="https://zaplata.sk/wp-content/uploads/2018/09/fb_logo.png" width="33px"/></a>
<a href="https://www.instagram.com/zaplata.sk/" target="_blank"><img style="margin : 1.5px 100px 0px 0px" src="https://zaplata.sk/wp-content/uploads/2018/09/instagram.png" width="33px"/></a>
</p></div>
And voilà! Problem solved, everything now functions seamlessly as intended. 😊