Tables: Before you yawn and go back to just pasting cat gifs for emphasis, it's how the entire internet does page layout in html.
There are three vBulletin c/o Bluelight Official Formats, plus some hacks. Note that "tr" means table row, "td" means table data (ie., single-cell contents) and a secret "th" is "table header" that automatically centers, bolds, and thin-grid outlines. There are no column tags.
No borders:
| Codeine | Kratom |
| Loperamide | DXM |
| Cimetidine | White Grapefruit Juice |
Outer border:
[TABLE="class: outer_border"]
[TR]
[TD]Codeine[/TD]
[TD]Kratom[/TD]
[/TR]
[TR]
[TD]Loperamide[/TD]
[TD]DXM[/TD]
[/TR]
[TR]
[TD]Cimetidine[/TD]
[TD]White Grapefruit Juice[/TD]
[/TR]
[/TABLE]
And thick grid:
[TABLE="class: grid"]
[TR]
[TD]Codeine[/TD]
[TD]Kratom[/TD]
[/TR]
[TR]
[TD]Loperamide[/TD]
[TD]DXM[/TD]
[/TR]
[TR]
[TD]Cimetidine[/TD]
[TD]White Grapefruit Juice[/TD]
[/TR]
[/TABLE]
You can get a thin grid manually if you choose an undefined class (pretty sure "lopelover" is not a defined class in the bluelight style book, at least so far):
[TABLE="class: lopelover"]
[TR]
[TD]Codeine[/TD]
[TD]Kratom[/TD]
[/TR]
[TR]
[TD]Loperamide[/TD]
[TD]DXM[/TD]
[/TR]
[TR]
[TD]Cimetidine[/TD]
[TD]White Grapefruit Juice[/TD]
[/TR]
[/TABLE]
Here's the code: (nb: syntax, case, and even declaration order, is crucial)
[TABLE="class: lopelover"]
[TR]
[TD]Codeine[/TD]
[TD]Kratom[/TD]
[/TR]
[TR]
[TD]Loperamide[/TD]
[TD]DXM[/TD]
[/TR]
[TR]
[TD]Cimetidine[/TD]
[TD]White Grapefruit Juice[/TD]
[/TR]
[/TABLE]
You can also nest tables, set fixed pixel-widths OR percentage of the screen to fill, and set the color for the background, probably the handiest thing in all of BBCode-dom. Note that's one large 1x3 table, each cell containing another table, aligned right, left and center, variable widths and borders.
[TABLE="class: outer_border, width: 95%"]
[TR]
[TD="bgcolor: ivory"][TABLE="class: grid, width: 50%, align: right"]
[TR]
[TD]
benzo
[/TD]
[TD]
azepine
[/TD]
[/TR]
[TR]
[TD="align: center"]
tropane[/TD]
[TD="align: center"]
alkaloid[/TD]
[/TR]
[/TABLE]
[/TD]
[TD="bgcolor: orangered"][TABLE="class: outer_border, width: 70%, align: left"]
[TR]
[TD]
beta-carboline[/TD]
[TD]
passaflorine[/TD]
[/TR]
[TR]
[TD]
phenones[/TD]
[TD]
benzo ones[/TD]
[/TR]
[/TABLE]
[/TD]
[TD="bgcolor: olive"][TABLE="width: 25%, align: center"]
[TR]
[TD]
pethidine[/TD]
[TD]
mPPP[/TD]
[/TR]
[TR]
[TD]
prolintane[/TD]
[TD]
MDPV[/TD]
[/TR]
[/TABLE]
[/TD]
[/TR]
[/TABLE]
The copypasta code:
[TABLE="class: outer_border, width: 95%"]
[TR][TD="bgcolor: ivory"][TABLE="class: grid, width: 50%, align: right"]
[TR][TD]benzo
[/TD][TD]azepine
[/TD][/TR]
[TR][TD="align: center"]tropane[/TD][TD="align: center"]alkaloid[/TD][/TR]
[/TABLE]
[/TD]
[TD="bgcolor: orangered"][TABLE="class: outer_border, width: 70%, align: left"]
[TR][TD]beta-carboline[/TD][TD]passaflorine[/TD][/TR]
[TR][TD]phenones[/TD][TD]benzo ones[/TD][/TR]
[/TABLE]
[/TD]
[TD="bgcolor: olive"][TABLE="width: 25%, align: center"]
[TR][TD]pethidine[/TD][TD]mPPP[/TD][/TR]
[TR][TD]prolintane[/TD][TD]MDPV[/TD][/TR]
[/TABLE]
[/TD][/TR][/TABLE]
Just about anything can go in a table cell, like other tables, but also bulleted lists and images. You can also make a cell span multiple columns.
[TABLE="width: 90%"]
[TR]
[TD="bgcolor: ivory"]
[/TD]
[TD="bgcolor: ivory"]
*
*
*
that's a cat
[/TD]
[TD="bgcolor: ivory"]
- substituted
.
- phenyl
.
- morpholines
.
[/TD]
[/TR]
[TR]
[TD="bgcolor: maroon"]
phenmetrazine
[/TD]
[TD="bgcolor: indigo"]
diphenyl piperidines
[/TD]
[TD="bgcolor: darkslategrey"]
nicotine
[/TD]
[/TR]
[TR]
[TD="bgcolor: deeppink, colspan: 3"]
or span across the whole thing
[/TD]
[/TR]
[/TABLE]
Here's more code, I know you want to steal it:
[TABLE="width: 90%"]
[TR]
[TD="bgcolor: ivory"][/TD]
[TD="bgcolor: ivory"]*
*
*
that's a cat
[/TD]
[TD="bgcolor: ivory"]
- substituted
.
- phenyl
.
- morpholines
.
[/TD]
[/TR]
[TR]
[TD="bgcolor: maroon"]phenmetrazine
[/td]
[TD="bgcolor: indigo"]diphenyl piperidines
[/td]
[TD="bgcolor: darkslategrey"]nicotine
[/td][/tr]
[tr]
[td="bgcolor: deeppink, colspan: 3"]or span across the whole thing
[/td][/tr]
[/table]
For now, with great shame, my only hack to get vertical alignment working is to insert text, then make the font color match the background color. A similar trick with invisible cells can make the columns all the same width. That starts to eat into the time you need to update the loperamide body count tracker.
Pasting from a spreadsheet or word processor works pretty well, best to keep the formats to a minimum and only things you know vbulletin can handle.
Questions? Why yes, there's still more hacks uncovered every day!
