CSS

【CSS】レスポンシブグリッドレイアウトGRID SYSTEM WITH FLEXBOX

December 30, 2016
GRID SYSTEM WITH FLEXBOX

GRID SYSTEM WITH FLEXBOXはDisplay flexによるレスポンスグリッドレイアウト。

Grid Breakpoints

HTMLにクラスを追加します。.D-6 のように.{classname}-{column}
クラス名を変更し、必要な複数のブレークポイントを追加することができます。

Auto layout

<div class="container">
 <div class="row">
	<div class="M">...</div>
	<div class="M">...</div>
	<div class="M">...</div>
 </div>
</div>

Demo/Download