Creates a region of its container (such as the browser
window or a cflayoutarea tag) with a specific layout
behavior: a bordered area, a horizontal or vertically
arranged box, or a tabbed navigator.

  <cflayout type="accordion">


This tag requires Adobe ColdFusion 8 and up.  Not supported on Lucee, etc.

Discouraged: The use of tags generating UI is generally discouraged by the CFML community. See:

Attribute Reference

type string
Default: border

The type of layout.
  • accordion
  • border
  • hbox
  • tab
  • vbox

align string
Default: center

Specifies the default alignment of the content of
child layout areas. Each cflayoutarea tag can specify
an alignment attribute to override this value.
  • center
  • justify
  • left
  • right

name string

The name of the layout region. Must be unique
on a page.

padding string

Applies only to hbox and vbox layouts.
You can use any valid CSS length or percent format,
such as 10, 10% 10px, or 10em, for this attribute.
The padding is included in the child layout area
and takes the style of the layout area.

style string

A CSS style specification that defines layout styles.

tabheight numeric

A CSS style specification that defines layout stApplies only to tab type layouts. Specifies the
height of the content area of all child layout
areas. You can override this setting by
specifying a height setting in an individual
cflayoutarea tag style attributes.

tabposition numeric
Default: top

Applies only to tab type layouts. Specifies the
location of the tabs relative to the tab region
  • top
  • bottom

titlecollapse boolean
Default: true

Specify whether title bar should act as collapse/expand toggle or not; default=true.
  • true
  • false

activeontop boolean
Default: false

Specify whether active tab needs to be on top always; default=false.
  • true
  • false

fillheight boolean
Default: true

True to adjust the active item's height to fill the available space in the container; default=true.
  • true
  • false

fitToWindow boolean
Default: true

A Boolean value that specifies whether the border layout should occupy 100% of the width and height of the window
  • true
  • false

height numeric

width numeric

buttonStyle string

Sample code using the cflayout tag

Signup for cfbreak to stay updated on the latest news from the ColdFusion / CFML community. One email, every friday.

Fork me on GitHub