Image element rendering out of position occassionally on small screens

I have some elements that our occasionally loading out of position. Once I change the screen size or orientation any bit, it seems to refresh that element and snap it back into position. Has anybody run into this issue before?

It looks like the image tags are adding a 141.016px margin. I’m not sure if this is a bug or what.

<img alt="" src="https://d1muf25xaso8hp.cloudfront.net/https%3A%2F%2Fs3.amazonaws.com%2Fappforest_uf%2Ff1536099355402x933936467394232700%2FMilitary%2520Press.png?w=512&amp;h=128&amp;auto=compress&amp;fit=max" style="display: block; margin: 0px 0px 0px 141.016px; width: 97.9688px; height: 100%; border-radius: 0px;">

Completely out of position

Slightly out of position

Proper Positioning

Sorry to ask the obvious, but have you tried apply a max width? I had a group doing that and when I applied the max width it behaved how I wanted it.

Along with @freehold2018’s point about experimenting with applying a max width, hop into the responsive view in your application and ensure the image element’s fixed margin is set to center.

Part of the issue is likely that the image is “scaling” to the size of the repeating group as the page size changes. If you want for that intended effect, check the “Keep element proportions” box.

@dan1 @freehold2018 Tried both of these and it didn’t make a difference. I found a fix for the issue though. I do think it was a bug.

The elements that were doing this were inside of a group that was only visible when something wasn’t empty.
00%20PM

When I swapped it around to be visible on page load and not visible when empty, it all renders properly in the right position with no strange margining pushing it out of view.

Ah, that’ll do it! :slight_smile: