webpackJsonp([0xda3f0f8ed7b0],{526:function(n,t){n.exports={pathContext:{frontmatter:{path:"/docs/justify-content",title:"Justify Content",hasPlayground:!0,initialPlayground:null,redirect:null},html:"<h2>Justify Content</h2>\n<p>Justify content describes how to align children within the main axis of their container.\nFor example, you can use this property to center a child horizontally within a container\nwith <code>flex direction</code> set to <code>row</code> or vertically within a container with <code>flex direction</code>\nset to <code>column</code>.</p>\n<p><strong>FLEX START (DEFAULT)</strong> Align children of a container to the start of the container's main axis.</p>\n<p><strong>FLEX END</strong> Align children of a container to the end of the container's main axis.</p>\n<p><strong>CENTER</strong> Align children of a container in the center of the container's main axis.</p>\n<p><strong>SPACE BETWEEN</strong> Evenly space of children across the container's main axis, distributing\nremaining space between the children.</p>\n<p><strong>SPACE AROUND</strong> Evenly space of children across the container's main axis, distributing\nremaining space around the children. Compared to <code>space between</code> using\n<code>Sspace around</code> will result in space being distributed to the beginning of\nthe first child and end of the last child.</p>\n<p><controls prop=\"justifyContent\"></controls></p>"}}}});
//# sourceMappingURL=path---docs-justify-content-2999ee22d5e9c89dfe9a.js.map