User:Sddarealone/sandbox/WikicodeTest

/—\—/—\—/—\—/—\—/—\_Test 101_/—\—/—\—/—\—/—\—/—\

For any CSS styles, Wiki tables, HTML tables, Wiki templates, tools or other cool features that maybe new to me.

Summing up all features:

1. Wikitable default class="wikitable" ... basic (single pipe for cells, single exclamation for headings); standard (double pipes and exclamations); HTML (table, table row and table data tags)
2. CSS style inline with style="property:value" eg. style="color:red; background-color:blue;" and external using HTML ie. attribute=value eg. width=10em; align=left;
3. Collapsible tables. mw-collapsed for showing first then hide; mw-collapsible mw-collapsed for first hiding then show table.
4. Vertical scrollbar style="height:y; overflow:auto;" and horizontal scrollbar style="width:x; overflow-x:auto;".
5. Sticky table {{sticky header}} and in class="sticky header"; don't use with scrollbars or it won't work.
6. All CSS features (padding, spacing, margin, height, width, font and others) in table cells work just as standard CSS.
7. Row hover highlight {{row hover highlight}} to highlight on hovering row cells. White only cells class="mw-datatable" and Greyed cells class="hover-highlight".
8. Right alignment in table data cells using style="text-align:right" and center align using style="text-align:centre".
9. Decimal point alignment using {0|0...} if data cells are aligned to centre.
10. Column alignment using {{Table alignment}} and add in class="colxalign" where x is column no. and align is left, right and center.
11. Side by side tables without images using display:inline-grid; and with images style="vertical-align:top/center/bottom;" where customization can be added such as margin with margin-left:5em;. Note that <div> box is must.
12. Float table / images using float:left/right;

Each table consists of table padding, table spacing and cell padding. To be continued...

1. Vertical scroller

2. Horizontal scroller

A. Basic

Column wise filling

B. How2basic

Column wise filling

Row wise filling

C. HTML only

Column wise filling

4. Decimal Points

5. Column alignment

Side by side tables with or without images

1. Drop dlcb drop|X drcb used to largen the first letter of starting word in a sentence.

2. Using plainlist by dlcb Plainlist|... drcb; alternative dlcb plainlist drcb ... dlcb endplainlist drcb.

3. For horizontal list its dlcb hlist|...|...|... drcb.

Now comes the real thing

1. Simplest is lorem ipsum dlcb lorem ipsum dlrb

drop

are couldn't beat the tortoise in the race not because it was lazy, but because it was not slow and steady. Although if the roadrunner helped it, it would have won the race and we wouldn't have with us that Aesop's fable.

plainlist

My FC mobile squad (2024-25)

horizontal list

adding tocbox to show template src code

lorem ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

span the man

If you read this far, I'll give yer a wikilove. Knight Commander of the Order of Patience (yes it doesn't exist)

Table parameters

dropthing and dropimage used for drop controls.