See something you'd like to change or add, but you've never edited an open encyclopædia before? This overview was written to help absolute beginners get started.

Help:Collapsible boxes

From A Storehouse of Knowledge
Jump to: navigation, search

Collapsible information, navigation, or other boxes can be created as explained below.

Either tables or <div> elements can be used to create collapsible boxes.

Contents

Tables

Heading
Second row
Third row

In the case of tables, the first row will always be shown, and every other row can be either hidden or shown. The [hide] and [show] links will be in the first cell of the first row, so it is recommended that the first cell span all columns.

<div> boxes

Heading
First inner div
Second inner div
Third inner div

In the case of <div> elements, the box should be arranged as an outer <div> containing two or more inner <div> elements. The [hide] and [show] links will be in the first inner <div>, and the remaining inner <div> elements can be either hidden or shown. See the working illustration at right, which has margins and borders around each inner <div> for clarity.

General

Collapsible boxes can also be set to be collapsed by default, or collapsed by default if there are more than two collapsible boxes on the page. These can be controlled by means of applying class names to the boxes.

  • The class name collapsible makes the box collapsible.
  • The additional class name collapsed makes the box collapsed by default.
  • The additional class name autocollapse makes the box collapsed by default if there are more than two collapsible boxes on the page.

For ease of use (to avoid the show/hide button moving around), it is recommended that collapsible boxes be given a fixed width.

The following box is collapsed by default.

Differences from Wikipedia

With Wikipedia's collapsible tables, there needs to be a header row (<th>). This is not required here.

With Wikipedia's collapsible <div> boxes, the header and collapsible sections need their own class names. This is not required here.

Personal tools
Namespaces

Variants
Actions
visitor navigation
contributor navigation
monitoring
Toolbox