Resize Mode
4 MIN READ
Summary: Get familiar with the available resizing options.
Table of Contents
1. Initial Size
To illustrate how widgets scale, we'll use this example. We'll take this widget through every resize mode we offer and see how it scales. This works on desktop and mobile devices. Experiment by resizing your browser, or changing the orientation of your device after you embed a widget. Resizing will keep your content consistent and won't apply any stretching.
back up ↑
2. Allow Scale Down
The widget will scale down when resizing the container. The widget will not go above it’s initial size if the container is larger.
NOTE
When scaled, the widget keeps it's aspect ratio. For example, if the width is scaled down by 50%, so is the height.
back up ↑
3. Fixed
The widget will be cropped when resizing the container. The widget won’t scale.
back up ↑
4. Fixed Height
The widget will scale to 100% of the container’s width, keeping the height fixed.
NOTE
This is useful for widgets that need to spread across the entire width of the container, like a strip of photos or a newsfeed.
back up ↑
5. Fill Width
The widget will scale to 100% of the container’s width and the height will keep the aspect ratio. This means that in most cases, part of the widget will be cropped. Enable Autoscale to solve this problem.
back up ↑
6. Fill
The widget will scale to 100% of the container’s width and height. This works great for widgets that need to run in the background, like fullscreen galleries.