Template:MultiColumnBoxInstructions

Multi-Column Box Instructions

For both 2- and 3-column boxes (collectively known as "MultiColumnBoxes"). For creating single-column boxes, please see AboutUsBasicBox.

Color Variants

There are five color variations for the MultiColumnBox templates, which use proven web-safe colors. Additionally, the {{2ColumnBoxGray}} and {{3ColumnBoxGray}} templates allows for customizing the colors via passed parameters:

2-column boxes

• {{2ColumnBoxRed}}: Red
• {{2ColumnBoxBlue}}: Blue
• {{2ColumnBoxGreen}}: Green
• {{2ColumnBoxYellow}}: Yellow
• {{2ColumnBoxBoxGray}}: Gray

3-column boxes

• {{3ColumnBoxRed}}: Red
• {{3ColumnBoxBlue}}: Blue
• {{3ColumnBoxGreen}}: Green
• {{3ColumnBoxYellow}}: Yellow
• {{3ColumnBoxBoxGray}}: Gray

Basic uses

There are only 3 (or 4) parameters needed to be passed in the template call:

2-column boxes

• header = header text
• left = text for the left column
• right = text for the right column

3-column boxes

• header = header text
• left = text for the left column
• center = text for the center column
• right = text for the right column

2-Column Example:

{{2ColumnBoxBlue
| header = Box header here
| left = text for the left column
| right = text for the right column
}}

Result:

Box header here

text for the left column text for the right column

3-Column Example:

{{3ColumnBoxYellow
| header = Box header here
| left = text for the left column
| center = text for the center column
| right = text for the right column
}}

Result:

Box header here

text for the left column text for the center column text for the right column

Intermediate uses

In addition to the basic uses, users can specify a border (border is the same color as the header), or use these boxes for list with WikiMarkup

Adding a border

2-Column Example:

{{2ColumnBoxGreen
| header = Box header here
| left = text for the left column
| right = text for the right column
| border = 2px
}}

Result:

Box header here

text for the left column text for the right column

Advanced uses

Changing Colors

For advanced users, the {{2ColumnBoxGray}} and {{3ColumnBoxGray}} templates offers a variety of customizations, please note, for best compatibility, use web-safe colors like those found on the W3 Schools website:

• header-color = specify color for header; defaults to dark gray if not present.
• body-color = specify color for body style (can be same as header for mono-toned boxes); defaults to light gray if not present.

2-Column Example:

{{3ColumnBoxGray
| header = Box header here
| left = text for the left column
| center = text for the center column
| right = text for the right column
| border = 2px
| header-color = CC00CC
| body-color = CC99CC
}}

Result:

Box header here

text for the left column text for the center column text for the right column

Setting Width and Float

NOTE: The MultiColumnBoxes are designed to be used "full page" in the wiki, however, they have been created in such a way that it is possible for highly-advanced editors to wrap them in an "div" to make them smaller and "float" within a text block.

Example:

<div style="float:left; width:250px;
padding-right:10px;">
{{2ColumnBoxGray
| header = Box header here
| left = text for the left column
| right = text for the right column
}}</div>

Result:

Box header here

text for the left column text for the right column