Difference between revisions of "Template:Textbox"
(Solution for equal signs) |
|||
(21 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
− | <includeonly><div class="textbox | + | <includeonly><div class="textbox {{{1|}}}"><!-- |
− | {{#if: {{{2}}} |<div class= | + | -->{{#if:{{{2|}}}|<div class=textbox-head>{{{2}}}</div>}}<!-- |
− | <div class= | + | -->{{#if:{{{3|}}}|<div class=textbox-body>{{{3}}}</div>}}<!-- |
− | + | --></div></includeonly><noinclude> | |
− | + | == Usage == | |
− | |||
− | |||
− | + | ''textbox'' elements create CSS based boxes and tables. The presentation is controlled by [[MediaWiki:Common.css]]. | |
− | {{textbox|| | + | Usage: '''<nowiki>{{textbox|attributes|head_line|text}}</nowiki>''' |
+ | or in tables: '''class="textbox attributes"''' | ||
+ | <ul> | ||
+ | <li> | ||
+ | '''attributes''' is one or more of the following keywords: | ||
+ | * Color scheme: | ||
+ | ** '''news''': news (=cyan) | ||
+ | * Concrete colors: '''red''', '''orange''', '''yellow''', '''green''', '''cyan''', '''blue''', '''magenta''', '''white''', '''gray''' and '''black''' | ||
+ | * Alignment: | ||
+ | ** '''center''': centered text. | ||
+ | ** '''float-left''': ''left floated'' textbox or table. | ||
+ | ** '''float-right''': ''right floated'' textbox or table. | ||
+ | * Options: | ||
+ | ** '''headline''': The first line is a column header and will be set with a emphasized color. | ||
+ | ** '''grid''': A colored grid (tables only). | ||
+ | ** '''alt''': Alternating row colors (tables only). | ||
+ | ** '''large''': Head line and text is enlarged by 20%. | ||
+ | ** '''huge''': Head line and text is enlarged by 40%. | ||
+ | </li> | ||
+ | <li>'''head_line''': The head line of the textbox or table, always centered.</li> | ||
+ | <li>'''text''': free wiki text for textbox body.</li> | ||
+ | </ul> | ||
+ | If '''head_line''' or '''text''' contains an equal sign (=), use <tt>'''<nowiki>{{=}}</nowiki>'''</tt> instead. | ||
− | {{textbox|red| | + | == Textbox Examples == |
+ | |||
+ | {{textbox||standard textbox|Textbox without attributes}} | ||
+ | |||
+ | === Named schemas for special usage === | ||
+ | |||
+ | This named schemes are preferred over the concrete colors. | ||
+ | |||
+ | {{textbox|news|Table 'news'| | ||
+ | '''Attributes:''' news | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | === Concrete Colors === | ||
+ | |||
+ | Textbox examples with alternating attributes: | ||
+ | |||
+ | {{textbox|red|Table 'red'| | ||
+ | '''Attributes:''' red | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|orange large|Table 'orange large'| | ||
+ | '''Attributes:''' orange large | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|yellow huge|Table 'yellow huge'| | ||
+ | '''Attributes:''' yellow huge | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|green center|Table 'green center'| | ||
+ | '''Attributes:''' green center | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|cyan|Table 'cyan'| | ||
+ | '''Attributes:''' cyan | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|blue large|Table 'blue large'| | ||
+ | '''Attributes:''' blue large | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|magenta huge|Table 'magenta huge'| | ||
+ | '''Attributes:''' magenta huge | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|white center|Table 'white center'| | ||
+ | '''Attributes:''' white center | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|gray|Table 'gray'| | ||
+ | '''Attributes:''' gray | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | {{textbox|black large|Table 'black large'| | ||
+ | '''Attributes:''' black large | ||
+ | |||
+ | A short sentence. | ||
+ | |||
+ | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | }} | ||
+ | |||
+ | == Table Examples == | ||
+ | |||
+ | The following examples show tables with alternating attribute. | ||
+ | The right tables use additionally ''float-right'. | ||
+ | |||
+ | <div class="float-right"> | ||
+ | {| class="textbox red alt grid float-right" | ||
+ | |+ Table 'red alt grid float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |red alt grid float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox orange alt float-right" | ||
+ | |+ Table 'orange alt float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |orange alt float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox yellow grid float-right" | ||
+ | |+ Table 'yellow grid float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |yellow grid float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox green float-right" | ||
+ | |+ Table 'green float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |green float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox cyan alt grid float-right" | ||
+ | |+ Table 'cyan alt grid float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |cyan alt grid float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox blue alt float-right" | ||
+ | |+ Table 'blue alt float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |blue alt float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox magenta grid float-right" | ||
+ | |+ Table 'magenta grid float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |magenta grid float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox white float-right" | ||
+ | |+ Table 'white float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |white float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox gray alt grid float-right" | ||
+ | |+ Table 'gray alt grid float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |gray alt grid float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox black alt float-right" | ||
+ | |+ Table 'black alt float-right' | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |black alt float-right | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | </div> | ||
+ | |||
+ | {| class="textbox red headline" | ||
+ | |+ Table 'red headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |red headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox orange grid headline" | ||
+ | |+ Table 'orange grid headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |orange grid headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox yellow alt headline" | ||
+ | |+ Table 'yellow alt headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |yellow alt headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox green alt grid headline" | ||
+ | |+ Table 'green alt grid headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |green alt grid headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox cyan headline" | ||
+ | |+ Table 'cyan headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |cyan headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox blue large grid headline" | ||
+ | |+ Table 'blue large grid headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |blue large grid headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox magenta huge alt headline" | ||
+ | |+ Table 'magenta huge alt headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |magenta huge alt headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox white center alt grid headline" | ||
+ | |+ Table 'white center alt grid headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |white center alt grid headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox gray headline" | ||
+ | |+ Table 'gray headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |gray headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
+ | |||
+ | {| class="textbox black grid headline" | ||
+ | |+ Table 'black grid headline' | ||
+ | |- | ||
+ | !<th> | ||
+ | !<td> | ||
+ | |- | ||
+ | !Attributes: | ||
+ | |black grid headline | ||
+ | |- | ||
+ | !Text 1: | ||
+ | |A short sentence. | ||
+ | |- | ||
+ | !Text 2: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 3: | ||
+ | |A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. | ||
+ | |- | ||
+ | !Text 4: | ||
+ | |A short sentence. | ||
+ | |} | ||
− | |||
</noinclude> | </noinclude> |
Latest revision as of 10:24, 25 August 2019
Usage
textbox elements create CSS based boxes and tables. The presentation is controlled by MediaWiki:Common.css.
Usage: {{textbox|attributes|head_line|text}} or in tables: class="textbox attributes"
-
attributes is one or more of the following keywords:
- Color scheme:
- news: news (=cyan)
- Concrete colors: red, orange, yellow, green, cyan, blue, magenta, white, gray and black
- Alignment:
- center: centered text.
- float-left: left floated textbox or table.
- float-right: right floated textbox or table.
- Options:
- headline: The first line is a column header and will be set with a emphasized color.
- grid: A colored grid (tables only).
- alt: Alternating row colors (tables only).
- large: Head line and text is enlarged by 20%.
- huge: Head line and text is enlarged by 40%.
- Color scheme:
- head_line: The head line of the textbox or table, always centered.
- text: free wiki text for textbox body.
If head_line or text contains an equal sign (=), use {{=}} instead.
Textbox Examples
Named schemas for special usage
This named schemes are preferred over the concrete colors.
Attributes: news
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Concrete Colors
Textbox examples with alternating attributes:
Attributes: red
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: orange large
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: yellow huge
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: green center
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: cyan
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: blue large
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: magenta huge
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: white center
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: gray
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Attributes: black large
A short sentence.
A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times.
Table Examples
The following examples show tables with alternating attribute. The right tables use additionally float-right'.
Attributes: | red alt grid float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | orange alt float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | yellow grid float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | green float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | cyan alt grid float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | blue alt float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | magenta grid float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | white float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | gray alt grid float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
Attributes: | black alt float-right |
---|---|
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | red headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | orange grid headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | yellow alt headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | green alt grid headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | cyan headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | blue large grid headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | magenta huge alt headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | white center alt grid headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | gray headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |
<th> | <td> |
---|---|
Attributes: | black grid headline |
Text 1: | A short sentence. |
Text 2: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 3: | A longer message. The message is repeated several times. A longer message. The message is repeated several times. A longer message. The message is repeated several times. |
Text 4: | A short sentence. |