CSS

【CSS】柔軟なグリッドレイアウトFlexible grid

September 16, 2017

Flexible gridは、フレキシブルグリッドシステムの構築に精通しています。

Flex Container

flex

flex, inline-flex

<div class="flex-row d-flex d-flex">
    <div class="flex-item"> <div class="content"> flex item 1</div></div>
    <div class="flex-item"> <div class="content"> flex item 2</div></div>
    <div class="flex-item"> <div class="content"> flex item 3</div></div>
</div>

inline-flex

<div class="flex-row d-flex d-inline-flex">
    <div class="flex-item"> <div class="content"> flex item 1</div></div>
    <div class="flex-item"> <div class="content"> flex item 2</div></div>
    <div class="flex-item"> <div class="content"> flex item 3</div></div>
</div>