Content in an email is often organized in multiple columns. When viewed on a mobile device, those columns can become quite narrow and lead to a sub-optimal reading experience. In order to guarantee a better experience while reading emails and other campaigns on mobile devices, the campaign editor applies code that automatically stacks content vertically. This helps content stay organized in a manner that makes zooming unnecessary and is easy to scroll with a finger. Vertical stacking is supported by the most popular mobile email clients. In some cases, the desktop version will be displayed. That happens when a client lacks support for standard CSS.
Although it normally helps, there are cases in which vertical stacking of columns may not lead to an optimal result. There is a field setting, Do not stack on mobile, that can turn off the stacking default behavior as explained further below.
A common scenario is using a row to display a navigation bar with text links or icons. In that scenario, as shown below, a vertical layout could create excessive empty space, hiding important elements of the message or giving too much visibility at the top of the email to content that is not supposed to be that prominent.
Observe a navigation bar example with vertical stacking vs. horizontal display
Observe An example with illustration. The default behavior of the campaign editor is to stack content blocks automatically for optimal mobile responsiveness.
With the introduction of the Do not stack on mobile row setting, users of the campaign editor can decide when to override the default behavior that prevents columns from stacking vertically on mobile devices.
The option is available in the right pane as a row property, toggled OFF by default.
Email design best practices suggest a careful use of this display setting. A user-friendly vertical layout on mobile makes sense in most cases. As always, it is up to you and your creativity when and how to use this option.
This article covers how the campaign editor automatically applies vertical stacking of content blocks when viewing messages or campaigns on mobile devices including a method for toggling off the vertical stacking feature using the Do not stack on mobile switch.
Content in an email is often organized in multiple columns. When viewed on a mobile device, those columns can become quite narrow and lead to a sub-optimal reading experience. In order to guarantee a better experience while reading emails and other campaigns on mobile devices, the campaign editor applies code that automatically stacks content vertically. This helps content stay organized in a manner that makes zooming unnecessary and is easy to scroll with a finger. Vertical stacking is supported by the most popular mobile email clients. In some cases, the desktop version will be displayed. That happens when a client lacks support for standard CSS.
Although it normally helps, there are cases in which vertical stacking of columns may not lead to an optimal result. There is a field setting, Do not stack on mobile, that can turn off the stacking default behavior as explained further below.
A common scenario is using a row to display a navigation bar with text links or icons. In that scenario, as shown below, a vertical layout could create excessive empty space, hiding important elements of the message or giving too much visibility at the top of the email to content that is not supposed to be that prominent.
Observe a navigation bar example with vertical stacking vs. horizontal display
Observe An example with illustration. The default behavior of the campaign editor is to stack content blocks automatically for optimal mobile responsiveness.
With the introduction of the Do not stack on mobile row setting, users of the campaign editor can decide when to override the default behavior that prevents columns from stacking vertically on mobile devices.
The option is available in the right pane as a row property, toggled OFF by default.
Email design best practices suggest a careful use of this display setting. A user-friendly vertical layout on mobile makes sense in most cases. As always, it is up to you and your creativity when and how to use this option.
