Initializing help system before first use

Using Sections to Organize Page Content

Introduced in the example app earlier, VDL sections can help you structure and organize your page content - they correspond to the Bootstrap container class.
Sections can be nested, and can have an optional heading attribute: 
<vdl-section heading="Welcome to Portfolio Optimization"
             heading-level="1">
  <vdl-section heading="Return per share"
               heading-level="2"></vdl-section>
</vdl-section>

As is depicted above, you can also provide a heading-level attribute that controls the weight of the heading text - these follow the typical HTML conventions, with level 1 the largest.

Controlling Section Widths

By default, sections have a fixed width of 1140 pixels. If the browser window is too narrow to display the full content, scrollbars will appear. You can customize the width by adding the width attribute to the <vdl-section> element - widths are specified in pixels. 
<vdl-section width="1000">This section is 1000 pixels wide.</vdl-section>
By contrast to using a fixed width, sections can also be defined as fluid using a layout="fluid" attribute, where text and other content reflow to fit the browser's width whenever it is resized. 
<vdl-section layout="fluid">
  This text will wrap onto the next line if the window becomes too narrow.
</vdl-section>

In a default fixed width section, the column widths are fixed at 97.5 pixels per size unit. If the width of a fixed section is set to something other than the default, the column widths will adjust automatically to maintain 12 columns across the section width.

The width attribute is not permitted on a fluid section.

Parent Topic Working with Page Layouts and Styling

© 2001-2019 Fair Isaac Corporation. All rights reserved. This documentation is the property of Fair Isaac Corporation (“FICO”). Receipt or possession of this documentation does not convey rights to disclose, reproduce, make derivative works, use, or allow others to use it except solely for internal evaluation purposes to determine whether to purchase a license to the software described in this documentation, or as otherwise set forth in a written software license agreement between you and FICO (or a FICO affiliate). Use of this documentation and the software described in it must conform strictly to the foregoing permitted uses, and no other use is permitted.