Responsive export not showing both layouts

Question

Having some issues exporting a magazine layout that has a desktop version and an alternate layout for mobile. The main issue is that regardless of my setting when exporting a range with Responsive Layouts, the magazine is not previewing correctly regardless of the options chosen (shown below).  Both Page Layouts fulfill the requirements for responsive export (alternate layout present and matching pages). I’ve perused the knowledge looking for anyone having the same issue but haven’t located a solution. There’s clearly something I’m missing since I’m able to Export each layout separately and they work fine...here are the links. Thank you for your assistance !

DESKTOP:
https://fastforwardseven.com/pubs/jamaica-desktop/

MOBILE:
https://fastforwardseven.com/pubs/jamaica-mobile/

BASIC SETTINGS: 
Export Range: Responsive Layouts
Output: Web
Page Format: Flipbook with Page Peel

ADVANCED:
Use Desktop Scaling (but also tried Let Device Choose, Let in5 Choose and a couple others)

Answer 1

I'm sorry that you're having trouble exporting a responsive layout. Thank you for posting links to your output. Would you be able to send us your InDesign file to troubleshoot? You can send it here:

• https://ajarproductions.com/pages/contact.php?category=in5

Comments

For anyone else with a similar question, the issue here was that the Desktop layout's width was smaller than the Mobile layout's width. The larger width made the Mobile layout appear first when opened on the desktop.

Whenever creating responsive layouts, it's helpful to know that there are two options for changing layouts:

1. If you have exactly 2 layouts that are the same size but one is rotated, then in5 will generate the code to adapt to device orientation.
2. If you have 2 or more layouts of different sizes, then in5 will generate the code to tell the browser to swap layouts at different pixel widths.

Here's a video at the point where Justin describes the differences.