BNL Home

Slats

Many of the BNL content management functions write out database records in "slats" format, where each record is returned as a unique list item <li> in an unordered list with a class of "slats" <ul class="slats">.

Slats on White

When the slats are displayed on/within an element that has a white background, there is less padding (.8em) added to the right or left side of the individual slat items.

Slats on Color

When the slats are displayed on/within an element that has a colored background or a background image, an additional .onCanvas class is added to the ol.slats by the BNL template jQuery code. This class will add additional padding (1.6em total) to the right or left side of the individual slat items so they are set off from the background of the container element.

This will occur automatically and does not require any additional classes or styles to be specified by the developer in the page code.

Simple Example

In Bounding Box

In Tabs