2022.1

The Div elements inside the row take up 2, 4 and 6 parts of the total amount of screen size
(divided in 12 parts) on a small screen. On a large screen they each take one third of the
available space. If the class large-4 would have been left out, the Divs would take up 2, 4 and
6 parts of the available space, regardless of the screen size.
There's more that you can do with the Grid, for example, you could center columns, or switch
columns depending on the screen size they are viewed on. For information about all these
possibilities, see this website:
http://foundation.zurb.com/sites/docs/v/5.5.3/components/grid.html.
Adding Divs and classes to a Connect Form template
To insert a Div, select Insert > Structural Elements > Div on the menu. To add a class to the
Div, select the Div (see "Selecting an element" on page669) and type the class in the Class
field on the Attributes pane.
To add Grid rows and columns quickly, you could also use the Grid snippets or Row snippets,
found in the Snippets folder on the Resources pane after using a wizard to create a
Foundation web page or a Capture OnTheGo template. For more information about Snippets,
see "Snippets" on page775. For more information about template wizards, see "Creating a
Web template with a Wizard" on page575 and "Capture OnTheGo template wizards" on
page612.
Alternatively, If you are familiar with HTML, you can open the Source tab of the Workspace and
simply type the HTML to add the Div elements and classes.
Tip
Use Emmet to create a Grid layout on the source tab really fast. See "Emmet" on
page550.
Other Foundation components
Foundation comes with many other components to improve and embellish Web forms and
pages . A few examples:
l An Accordion can be used to expand and collapse content that is broken into logical
sections, much like tabs. It can be very useful on long forms.
Page 619