日: 2016年4月28日

boxレイアウト flexbox

<script src="<?php echo get_stylesheet_directory_uri(); //flexbox?>/d/js/flexibility.js"></script>
 <div class="frex_box">

要素
要素
要素
</div>

less

/*フレキシブル　高さ揃える*/
.frex{
	-js-display: flex;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
	}

.frex_box{ width:100%;
         .frex;
	justify-content: flex-start;
	flex-wrap:wrap}

ブートcss モバイル

.frex_box{ max-width:300px; margin-left:auto; margin-right:auto}

http://liginc.co.jp/web/html-css/css/21024