- Section Gradient
"Section Gradient" redirects to this page as it is an extension of the Section component.
The Section component groups content together for:
- Re-use via the Reference component
- Styling the content
- Placing bullets into automated columns.
It also allows for the use of the Header and Footer components.
- Layout: None
- Bullet Columns: None
You can use the Header and Footer components without setting a layout or bullet columns option.
No special styles are applied to the content inside the section. This setting is recommended when creating content that will be reused (and possibly styled differently) elsewhere in the site.
- Padded Teaser
This layout adds some padding around the content inside the section. This layout option is required for sections in the sidebar that are not the gradient or solid background layouts.
This layout adds a gradient that matches the page's color theme behind the section content with the solid color starting at the top and fading toward the bottom. Note that this layout changes the styling for the Extra Large (h1) heading style.
- Solid Background
This layout places the section content in a padded section on top of a solid background matching the page's theme. Note that while it may appear that your solid background section has a smaller available grid width, if you have a grid-12 section, for example, with a solid background, your section will still have 12 grid columns with which to work.
Any bulleted lists in the section will appear with standard formatting with all bullets in a single column.
- 2 Columns
The system will take any bulleted lists in the section and divide each list into two approximately even columns. To enhance user readability, the system will not split a bullet between columns.
- 3 Columns
The system will take any bulleted lists in the section and divide each list into three approximately even columns. To enhance user readability, the system will not split a bullet between columns.
Important Note on Bullet Columns
Internet Explorer (versions 9 and earlier) does not support the code that renders the bullet columns. Internet Explorer 9 and earlier users will see bulleted content in a singular column regardless of this setting.