Images/Header Responsive Mobile Previews

[jasonsecrest]

I have been reading a lot of the support material and have found it quite helpful in terms of having the images and headers being responsive on mobile platforms. The mobile/screen size preview is confusing in Pro. It shows the large and small correctly but the middle sizes are showing double

(I have duplicated the sections and headers and have been using the customize breakpoints for full screens and mobile devices).

This is happening on images and headers that I am modifying for mobile responsiveness. I have tested on my I phone and it seems to be working properly, I don’t have a tablet to test if the double header/images will show like they do in the preview. I just don’t know why the preview shows otherwise. I have the customize to hide during the breakpoints and have gone through each element, but it still shows in the preview. Just ignore? or will it show on tablets?

Middle Sizes (All 3) show both headers:

Mobile and Full Width Show Correctly:

[rad]

Hi @jasonsecrest,

Thanks for reaching out.

I tried the live site and I don’t see any duplication, so perhaps this is specific to the builder preview. Would you mind providing your admin login credentials in a secure note?

For the meantime, make sure to clear your caches and install transient cleaner plugin and clean it.

Thanks!

[jasonsecrest]

I think it is just in the builder preview too. I have multiple pages that use the same process with images sizes for web and phones and can’t find any duplicates except in the builder preview.

Here is the responsive header test for mobile phones:
http://morganandjoshua.com/mobile/

[jade]

Hi there,

It seems to be something that happens on the builder preview only as I am not able to see the issue on the actual page.

Have you tried clearing your site’s cache and installing the transient cleaner plugin? If you already did but you are still seeing the issue, please provide us with your admin details so that we can check this further.

Thank you.