Template:Flexbox/doc
Appearance
This is a documentation subpage for Template:Flexbox. It may contain usage information, categories and other content that is not part of the original template page. |
{{Flexbox
|min-width= |max-width= |padding= |style=
|1=
|2=
|3=
|...
}}
This template is a CSS flexbox that places up to 15 content blocks of equal height and width in a row, allowing line wraps if the total content size exceeds the display width. The following settings can be adjusted:
- Flexbox CSS style: use the parameter
|style=
- Minimum and maximum width of the content blocks: use the parameters
|min-width=
and|max-width=
- Cell padding of the content blocks: use the parameter
|padding=
Example
[edit]Standard settings
[edit]{{Flexbox
|'''Block 1'''
* Item 1
|'''Block 2'''
* Item 1
* Item 2
* Item 3
|'''Block 3'''
* Item 1
* Item 2
|'''Block 4'''
* Item 1
* Item 2
|'''Block 5'''
* Item 1
}}
Block 1
- Item 1
Block 2
- Item 1
- Item 2
- Item 3
Block 3
- Item 1
- Item 2
Block 4
- Item 1
- Item 2
Block 5
- Item 1
Adjusted settings
[edit]{{Flexbox |min-width=300px |max-width=300px |padding=0.5em 1em 0.5em 1em |style=border:#ccc 1px solid;
|'''Block 1'''
* Item 1
|'''Block 2'''
* Item 1
* Item 2
* Item 3
|'''Block 3'''
* Item 1
* Item 2
|'''Block 4'''
* Item 1
* Item 2
|'''Block 5'''
* Item 1
}}
Block 1
- Item 1
Block 2
- Item 1
- Item 2
- Item 3
Block 3
- Item 1
- Item 2
Block 4
- Item 1
- Item 2
Block 5
- Item 1