Layout Issue in Firefox

[nextlevelbros]

I noticed that an element on my website which looks perfectly fine on Chrome looks janky when viewed on Firefox.

I am really not sure what is causing this, can someone give me some insight as to why this is happening and what could be done to fix it? I would really appreciate some help!

Screenshot, on the left is Firefox, on the right is Chrome:

Site Link: https://joza-ink.divhunt.us/builder

The issue is at the top left of the page.

[Pakic]

Remove position absolute from an image. Put it as position static?

[nextlevelbros]

It’s been a while we spoke about this, but I tried what you suggested and it does not seem to give the desired result.

Here is how it looks when I put it as position static:

Divhunt Element Positioning Issue in Firefox

Website: https://joza-ink.com/

Still looking for a solution to this layout issue, thanks.

[daphne]

This will work:
/* First image */
body main .t1240 {
width: 100%;
height: 100%;
z-index: 10;
position: absolute; <-Replace position: relative with position: absolute
max-width: 96px;
max-height: 96px;
object-fit: cover;
}

/* Second image /
body main .t1239 {
width: 100%;
height: 100%;
/ position: absolute; */ ← Remove position: absolute
max-width: 90px;
max-height: 90px;
margin-left: auto;
margin-right: auto;
border-radius: 100%;
}

[nextlevelbros]

Thank you so much @daphne, this works perfectly on both Chrome and Firefox, thats awesome! Also, welcome to the forums I really appreciate you taking the time to help me out with this.

I also decided to set the width and height of both images to a fixed pixel amount to avoid some content shifting when the page loads, now I think its totally perfect.