Page Structure:
Page Structure:
The section component creates a fixed-width container to add content to. It supports a large variety of content types, and is the primary content container for flex pages.
This is a section with text in it.
Sections have a config section with a number of options. The most commonly used options are "padding", "padding top", and "padding bottom" which are all used to control the content spacing on the page.
This section, and the one before, have padding set to 5. The first section on this page has padding set to 7 and a background color.
Id: sets the HTML id of the section. To be used in anchor links to scroll to certain parts of the page
Background color: sets the background color of the section
Padding: Adds padding to the top and bottom of the section
Padding Top: adds padding to the top only
Padding Bottom: adds padding to the bottom only
Text alignment: alignment of text in the section (left, right, or center)
Analytics label: will be set as the "Link Nav" option for links clicked within this section in Google Analytics.
Top Border Size: top border width in pixels
Top Border Color: hex color for the top border
Bottom Border Size: bottom border width in pixels
Bottom Border Color: hex color for the bottom border
This section uses a gradient background from teal to purple, going left to right.
this is a basic section with no options
this one has padding set to 5
this one has "padding bottom" set to 5. the ending padding of one section stacks with the beginning padding of the next section. depending on how your background colors and dividers are set up, you may want to normally only use padding on one end of the sections so they are evenly spaced.
this one has "padding top" set to 5. see the bigger gap between the sections.
text align center
text align right
this section has a 3px teal top border
this section has a 3px orange bottom border
this section has a 2px teal top border and a 4px purple bottom border. each side can have its own size and color.
previous few sections used "padding top", using "padding" on this one to add some breathing room above the footer.