Widgets overlap in the ArcGIS Experience Builder web experience

Description

After publishing a web experience in ArcGIS Experience Builder, the widgets in the web experience overlap, as shown in the image below. This behavior is observed when the web experience is consumed on a different machine, or it involves a change in monitor on the same machine.

Cause

This is expected behavior when a web experience is configured in a particular resolution. The widgets overlap when opened in a smaller resolution than the resolution set on the original machine where the web experience is published. This causes the contents to overlap.

Solution or Workaround

Change the resolution of the display on the local machine

Modify the display resolution of the local machine on the Display settings page. Refer to: Microsoft: Change your screen resolution in Windows for further instructions.

The image below shows the widgets no longer overlapping in the web experience.

Rearrange the widgets in ArcGIS Experience Builder

Note: 
This workaround requires the user to reposition the widget in the web experience.

In ArcGIS Experience Builder, move or resize the widgets to fit the web experience of the new display.

The image below shows the widgets resized and arranged to fit in the web experience in the new display resolution.