View source for Template:Flexbox wrap/doc

{{Documentation subpage}}

{{Uses TemplateStyles|Template:Flexbox wrap/styles.css}}

This template is used to create multiple blocks of content of equal width that are laid out side-by-side. The reader's web browser will shrink the width of the blocks as needed to try to fit them in the available width of the page. If there is insufficient space, then the blocks that cannot fit will wrap below the previous blocks.

== Usage ==
<syntaxhighlight lang="wikitext">
{{Flexbox wrap|start}}
Text for first block of text.
{{Flexbox wrap|break}}
Text for second block of text.
{{Flexbox wrap|break}}
...
{{Flexbox wrap|break}}
Text for N-th block of text.
{{Flexbox wrap|end}}
</syntaxhighlight>

== Examples ==

<syntaxhighlight lang="wikitext">
{{Flexbox wrap|start}}
=== American League ===
{{2009 AL East standings|seeds=1:Baltimore Orioles,4:Tampa Bay Rays,6:Toronto Blue Jays}}
{{2009 AL Central standings|seeds=3:Minnesota Twins}}
{{2009 AL West standings||seeds=2:Los Angeles Angels of Anaheim,5:Texas Rangers}}
{{Flexbox wrap|break}}
=== National League ===
{{2009 NL East standings|seeds=1:Atlanta Braves,4:Philadelphia Phillies,6:Miami Marlins}}
{{2009 NL Central standings|seeds=3:Milwaukee Brewers}}
{{2009 NL West standings|seeds=2:Los Angeles Dodgers,5:Arizona Diamondbacks}}
{{Flexbox wrap|end}}
</syntaxhighlight>

Output (reduce the width of the browser window to see the wrapping behaviour):

{{Flexbox wrap|start}}
=== American League ===
{{2009 AL East standings|seeds=1:Baltimore Orioles,4:Tampa Bay Rays,6:Toronto Blue Jays}}
{{2009 AL Central standings|seeds=3:Minnesota Twins}}
{{2009 AL West standings||seeds=2:Los Angeles Angels of Anaheim,5:Texas Rangers}}
{{Flexbox wrap|break}}
=== National League ===
{{2009 NL East standings|seeds=1:Atlanta Braves,4:Philadelphia Phillies,6:Miami Marlins}}
{{2009 NL Central standings|seeds=3:Milwaukee Brewers}}
{{2009 NL West standings|seeds=2:Los Angeles Dodgers,5:Arizona Diamondbacks}}
{{Flexbox wrap|end}}

<includeonly>{{Sandbox other||
[[Category:Multi-column templates]]
}}</includeonly>

== Template Data ==

{{TemplateData header}}
<templatedata>
{
  "description": "Lay out equal width blocks of content side-by-side. Any blocks that cannot fit are wrapped below the previous blocks.",
  "params": {
    "1": {
      "label": "start, break, or end",
      "description": "start = start the first block of content; break = start the next block of content; end = end all blocks of content",
      "suggestedvalues": [
        "start",
        "break",
        "end"
      ],
      "required": true,
      "type": "string"
    }
  },
  "format": "inline"
}
</templatedata>