Description

Inspired by the types of carousels which are becoming more commonplace in web-design, the Carousel condenses information from a number of elements into a single element on a mobile device (iOS).

Functionality

A desktop will display a set of rows and columns of information. A mobile will refactor these elements into a small carousel, allowing the user to control the view of the content, and toggle through appropriately.

Benefits

The Carousel increases engagement with content on a mobile device because it invites the user to interact with it. It also has a practical advantage of reducing the length of an email significantly, wherein a number of items of content is reduced to the space of just one.

It works in

Outlook 10/13+	Android (Galaxy S6)	iPhone/iPad	Windows (Nokia Lumia)	Outlook.com	Yahoo! Mail	Gmail

Known issues

Location	Requires fallback?	Fallback
Outlook 10/13+		Shows desktop view
Android (Galaxy S6)		S6 does not support the absolute positioning required, and so causes the carousel to break. The email flows like the content usually would without the carousel functionality.
iPhone/iPad		None. The current functionality does not extend to an iPad, but may be modified to include tablet sizes. Fully supported
Windows (Nokia Lumia)		The control of siblings and child elements in CSS has support, but is inconsistent in application. The email flows like the content usually would without the carousel functionality.
Outlook.com		Shows desktop view
Yahoo! Mail		Shows desktop view
Gmail		Shows desktop view