General guidelines for using widths
Widths are available in any block container element. Use widths to restrict how wide a block can be in the design. All width fields are optional. You do not need to set all three width properties. If you set a maximum width, you don’t need to set a minimum, and vice versa.
| Max Width | Flexible width; sets the largest possible responsive width |
| Min Width | Flexible width; sets the smallest possible responsive width |
| Rigid Width | Restrictive width; makes the element non-responsive |
How to use Max Width
Max Width is a flexible, fluid width option that determines the largest width of a container. A container will remain responsive until it reaches the max-width. For example, if an email is opened on a desktop screen that is 1024px wide, a block could be set to a max-width of 650px so it doesn't fill the entire width of the screen.
Valid values include:
none— No maximum value- Width value — e.g.,
10px,50%,2em
Example: Restricting the largest width of an image
Set a Max Width for an image when you want to restrict the largest width of the image.
1. Click on your image block in the right panel
2. Click on Styles to edit styles for This block
3. Click Block Container
4. Inside the Container, update the Max Width
How to use Min Width
Min Width is a flexible, fluid width option that determines the minimum width of a container. A container will remain responsive until it reaches the min-width. For example, if an email is opened on a desktop screen that is 1024px wide, a block could be set to a max-width of 650px so it doesn't fill the entire width of the screen.
Valid values include:
none— No maximum value- Width value — e.g.,
10px,50%,2em
Example: Restricting the smallest width of an image
Set a Min Width for an image when you want to restrict the smallest width of the image.
1. Click on your image block in the right panel
2. Click on Styles to edit styles for This block
3. Click Block Container
4. Inside the Container, update the Min Width
How to use Rigid Width
USE WITH CAUTION! Rigid Width is a rigid, non-fluid width. Width should be used when the container needs to be restricted to a specific width, regardless of screen size. For example, if a 300px image is uploaded into a text block and you want it to stay exactly that size on both desktop and mobile, set the rigid width to 300px.
Valid values include:
auto— Width is calculated by the browser- Width value — e.g.,
10px,50%,2em
Example: Restricting the total width of an image block
Set a Rigid Width for an image when you want to restrict the width of the image, making it non-fluid.
1. Click on your image block in the right panel
2. Click on Styles to edit styles for This block
3. Click Block Container
4. Inside the Container, update the Rigid Width
