Panels

Panels can be used within the main content area or within the sidebar. The markup is the same for both locations. When used in the sidebar, it is recommended that only .panel-standout and .panel-default be used.

The .panel-standout class can be used in conjunction with an optional .highlight class to add the triangle embelishment to the standout panel.

A panel consists of two parts a .panel-heading and .panel-body. .panel-heading can accept heading tags h2, h3, h4, or h5 headings. It can also use an icon from the icon library. To add an icon insert a span with the appropriate icon class name.

.panel-heading can also make use of an .options div. The .options div was created to hold extra controls like buttons, tabs, dropdown menus or other controls not existing yet. Content placed within the .options container will be floated to the right of the panel

NOTE: Buttons are not supported in panels used in the sidebar.


Examples:


Example: