A content box is created with `<tc:box/>`.

The title of the box is set by the `label` attribute or with `<f:facet name="label">`.

<tc:box label="Box">Content</tc:box> Title set by `label` attribute. Title set by `<f:facet name="label">`. Contentbox without a title.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer accumsan libero orci, vel lacinia nibh tincidunt nec. Praesent in euismod eros. Phasellus suscipit purus nisl, et posuere dolor iaculis at. Vivamus fringilla risus tellus, at sollicitudin nunc egestas at. Nullam hendrerit augue id nibh pharetra maximus. Vivamus eu turpis ut ligula euismod accumsan et eget lectus. Aenean ornare elit nisl, vitae bibendum dolor egestas varius. Fusce euismod leo at tristique auctor. Donec eget luctus dui.

A contentbox can be collapsed or expanded via the `collapsed` attribute. To define the behavior of hidden content, use the `collapseMode` attribute. For more information have a look at the page in the section.

It's possible to add a bar to the header of a content box. For that, the content box must contain the tag `<f:facet name="bar">`. The facet may contain `<tc:bar>` or other suitable tags.

Box with `<f:facet name="bar">`.

content

This example show collapsible/expandable boxes using the label facet.

Expanding/collapsing the first box, a full server request is executed. The other two boxes are reloaded with an ajax request.

In the collapsed form the last box only hide the content with CSS. The boxes 'Box 1' and 'Box 2' don't render the content at all.

See for more information about the collapsible concept.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.