Template:Div col

From Foxhole Wiki
Jump to navigation Jump to search
Template-info.png Documentation

Template:Div col is based on a template of the same name on Wikipedia. There are some slight adaptions to make it more suitable to this wiki. To use this template, place {{div col}} at the top of a list, possibly with all the desired modifiers, and {{div col end}} at the end of the list to stop the formatting.

Parameters

Arguments Explanation Example
colwidth Specifies the minimum width of the columns so that the number of columns is automatically based on screen width (that is, more columns will be shown on wider displays). Can be specified in any CSS unit of measure, for instance, the em (about the width of the capital "M" of the displayed typeface). If no value is supplied, the template uses a default of 30em. colwidth=15em
gap Specifies the space between the content of adjacent columns. Specified in any CSS unit, e.g, gap=2em. The default spacing (set by browser) is 1em. This modifier does not work (yet) -
Rules Adds vertical lines ("rules") between the columns if set to yes or some CSS styling (e.g. 1px dashed blue;).This modifier does not work (yet) Example
style CSS styling to apply to the columns. -
small sets font size to 90%. small=yes
Content content to apply to the columns. This is optional, as closing off this template without a content argument supplied will result in it working in the template modifying all text following the template until ended by {{div col end}}. This argument can be unhandy, as an error in the template will prevent any of the contents from displaying, while using the end-marker method will still display the contents. -

Various examples

Example with column width of 10em
{{div col|colwidth=10em}}
* a
* b
* c
* d
* e
* f
* g
* h
{{div col end}}
produces
  • a
  • b
  • c
  • d
  • e
  • f
  • g
  • h

This is an example text to show that the effect does not bleed thru.

  • This is an example list
  • Second part.
Example with column width of 20em and numbers
{{div col|colwidth=20em}}
# a 
# b
...
# s
{{div col end}}
produces
  1. a
  2. b
  3. c
  4. d
  5. e
  6. f
  7. g
  8. h
  9. i
  10. j
  11. k
  12. l
  13. m
  14. n
  15. o
  16. p
  17. q
  18. r
  19. s

Try changing the width of your browser window to see how the list changes

Example with column width of 20em and very long texts
{{div col|colwidth=20em}}
* So, as to give an example of how the lists function
* I write longer pieces of text than the single letters, as to display the effects
* of wrapping around.
* This also means texts of different lengths have to be
* used
* to properly show its properties.
* but on an ironic note, we shall end this list on a single letter anyway.
* Q
{{div col end}}
produces
  • So, as to give an example of how the lists function
  • I write longer pieces of text than the single letters, as to display the effects
  • of wrapping around.
  • This also means texts of different lengths have to be
  • used
  • to properly show its properties.
  • but on an ironic note, we shall end this list on a single letter anyway.
  • Q
Example with 'small' enabled
{{div col|colwidth=15em|small=yes}}
# a 
# b
...
# l
{{div col end}}
produces
  1. a
  2. b
  3. c
  4. d
  5. e
  6. f
  7. g
  8. h
  9. i
  10. j
  11. k
  12. l