nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Mobile View for Dashboard Embedded in Experience Builder

C837410204_CSUesri

Challenge:

We have a Web Experience that embeds the link to a Dashboard, where the Experience Builder Embed widget is encompassed within a Row widget. While this appears to be working when the Web Experience is viewed on a desktop device on a monitor, we’re having difficulty with this being workable on a mobile device. I’ve tried having the Dashboard configured both with and without a Mobile view for comparison. There are 2 challenges here when the Mobile view is configured:

When the platform is viewed on an actual mobile device, the page with the embedded dashboard appears squished even though the Row and Embed widgets have Height of “Stretch” (screenshot in bottom-right).
When a user looks at the Web Experience on a monitor but narrows the browser to be smaller size, the widgets appear squished (i.e. the Dashboard's Mobile view configuration isn’t reflected) (screenshot in top-right).

A few related posts:

Experience Builder Image widget aspect ratio not reflected on mobile device - Esri Community: Shows there appears to be a disconnect between how a Web Experience is viewed within the small device size test/monitor vs. on an actual mobile device.
Embedding Mobile Dashboard in Experience Builder app, does not display mobile View - Esri Community: Shows there appears to be challenges with viewing embedded dashboards within Web Experiences on a mobile device. I’m not totally following the solution for this post and wondering if this requires the Experience Builder developer edition.