FlexingtonはFlexboxを使用したグリッドフレームワーク。

<div class="row">
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
    <div class="col col-xs-12 col-sm-6 col-md-4 col-lg-3 col-xl-2">Flex</div>
</div>

MIT

• Tag
• CSS
• Flexbox
• Responsive