HOW TO

Prevent an image in the header from resizing in ArcGIS Experience Builder

Last Published: December 12, 2023

Summary

In ArcGIS Experience Builder, images in the header are important to enhance the overall visual appeal of an experience. Sometimes, these images are automatically resized and parts of the image are cut, as shown below.

Parts of the image in the header are cut off

This article describes the workflow to prevent an image in the header from resizing in ArcGIS Experience Builder.

Procedure

Note: 
Ensure the header is enabled in the experience. Refer to How To: Configure the header of a web experience for different screen sizes in ArcGIS Experience Builder for instructions.
  1. Open the ArcGIS Experience Builder project and navigate to the Insert widget panel.
  2. Under Page elements, drag and drop the Image widget in the header.
  3. Under Image source, select an image by uploading it from local files or providing the URL.
  4. Set the Position of the image to Fit in the drop-down menu.
  5. On the Style tab, under Size & Position, set the image Width to Auto and Height to 100%.

The entire image is displayed and not resized, as shown below.

The entire image is not resized or appears to be cut off   

Article ID: 000031546

Software:
  • ArcGIS Experience Builder

Receive notifications and find solutions for new or common issues

Get summarized answers and video solutions from our new AI chatbot.

Download the Esri Support App

Related Information

Discover more on this topic

Get help from ArcGIS experts

Contact technical support

Download the Esri Support App

Go to download options