Info Box
Infobox 1
Infobox Header
content
content
content
content
[[div style="background-color:#EEE;border:1px solid #000;width:200px;"]]
[[div class="pbgone" style="background-color:#000;color:#FFF;font-weight:bold;padding:5px;"]]
Infobox Header
[[/div]]
[[div style="padding:5px"]]
content
content
content
content
[[/div]]
[[/div]]Infobox Table 2 (floated right)
| Infobox | |
|---|---|
| Title | some text some text |
| Title | some text some text |
| Title | some text some text |
As you can see, the table is floated right. This text you are reading now is just here to show how the info box floats right and the text wraps around it.
[[div style="float:right;text-size:80%;margin-left:1%width:35%"]]
||||~ Infobox ||
|||| ||
||~ Title || some text some text ||
||~ Title || some text some text ||
||~ Title || some text some text ||
[[/div]]Infobox 3: Merging 1 and 2 Using SPAN
Infobox HeaderUsing DIV causes extra spaces to be inserted above and below the title line. You can use SPAN instead, but you need to include style="display:block;" for it to behave like a DIV.
This box is similar to Box 1, but is a bit tighter, because it uses SPAN instead of DIV tags. See Problems with Divs for more information. Unfortunately, using line breaks to make the code easier to read and edit also forces line breaks into the output, so you must instead put everything onto one line.
[[span style="display:block;float:right;background-color:#EEE;border:1px solid #000;width:200px;"]][[span class="pbgone" style="display:block;background-color:#000;color:#FFF;font-weight:bold;padding:5px;"]]Infobox Header[[/span]][[span style="display:block;padding:5px"]]Using DIV causes extra spaces to be inserted above and below the title line. You can use SPAN instead, but you need to include style="display:block;" for it to behave like a DIV.[[/span]][[/span]]
