Template:Box

From QWiki
Revision as of 16:42, 10 November 2016 by Bps (talk | contribs) (Created page with "<includeonly>{{#switch:{{lc:{{{1|}}}}} |break=</div> <div class{{=}}"template-box" style{{=}}"{{#if:{{{padding|}}}|padding-right:{{{padding}}};}}{{#if:{{{padding-bottom|}}}|pa...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Documentation (view - edit)

This template is to be used with fixed width objects to arrange them in a free "floating" fashion where they will take the least amount of vertical space by utalizing as much horizontal space as the individual "boxes" allows. There's also no limit to the amount of boxes you want to make with this, it can be anything from 2 to however many you want. But it does look bad if the objects/boxes are of different height.

Variables

The structure is as follows {{box| first variable | optional variable (padding=) }}

  • The first variable has three values you can set it to.
start
Used for the first instance in the array.
break
Used between two boxes.
end
Used to end the array of boxes.
  • padding= Defines the distance to neighbour elements towards the right. Set this to any value with either pixels (for example 5px) or em sizes (for example 1em).
  • padding-bottom= Defines the distance to neighbour elements towards the bottom. Set this to any value with either pixels (for example 5px) or em sizes (for example 1em).
  • box-width= Defines the width of the following box. Set this to any value with either pixels (for example 5px) or em sizes (for example 1em).
  • box-height= Defines the height of the following box. Set this to any value with either pixels (for example 5px) or em sizes (for example 1em).

Example

{{Box|start|padding=1em}}
{| class="wikitable" width="400px"
|<br />
|}
{{Box|break|padding=1em}}
{| class="wikitable" width="400px"
|<br />
|}
{{Box|break}}
{| class="wikitable" width="400px"
|
|}
{{Box|end}}

This code will become these three boxes below, displayed either in a single row a single column or 2 on one row and 1 on the next, depending on your browser window size. Also there's no need to use padding on the last break as nothing can come after it.





Adapted from Liquipedia