Template:Rounded info box/doc

This template is used on the Main page. Be careful when editing (test on your user page first!)

Examples

{{Rounded info box|Header|Text}}

Header

Text

Existing shortcuts

See Category:Rounded info box templates for a list of existing templates.

{{Red rounded info box|Header|Text}}

Header

Text

{{Grey rounded info box|Header|Text}}

Header

Text

{{Orange rounded info box|Header|Text}}

Header

Text

{{Green rounded info box|Header|Text}}

Header

Text

Custom colors

{{Rounded info box|Header|Text|bordercolor=red|hbgcolor=yellow|hcolor=#090}}

Header

Text

Bad example:

{{Rounded info box|Header|Text|hcolor=purple|hbgcolor=red|bgcolor=lime|color=rgb(255,150,10)|bordercolor=hsl(0, 100%, 0%)}}

Header

Text

Parameters (optional)

Colors

• color: The text color of the body (named after the CSS property)
• hcolor: The text color of the header
• bordercolor: Border color of the infobox (hard to see)
• bgcolor: Background color of the body
• hbgcolor: Background color of the header

Multiple formats are acceptable.

Format	Red	Light blue [1]
Hexadecimal	#f00 or #ff0000	#e0f0ff
Text	red	None [2]
RGB	rgb(255,0,0)	rgb(224,240,255)
HSL	hsl(0, 100%, 50%)	hsl(209, 100%, 94%)

[1] This is only an example - many other colors would also work.

[2] Some browsers may support a name for this color (like skyBlue) but it might not be consistent.

Layout

• align: The alignment of the body (defaults to "center")
• halign: The alignment of the header (defaults to "center")

Creating a new color scheme (shortcut to this template)

1. Create a new page with the text from Template:Red rounded info box (or another similar template).
2. Change the colors, preferably to something else.
3. Save the page.

Do not delete the <noinclude> section! It includes a link to this page so documentation is easy to find, and it won't show up when you use the template.

Technical Notes

• The rounded corners are produced with border-radius, -webkit-border-radius and -moz-border-radius, which don't work on all browsers (only ones that support CSS3)
• The header comes after the body in the template. Make sure you don't edit the wrong part by mistake!