레이아웃·16 / 26

Flexbox로 가로 배치하기

display: flex를 주면 그 안의 자식 요소들이 기본적으로 가로로 나란히 배치됩니다. 카드 여러 개를 한 줄로 늘어놓을 때 가장 많이 쓰는 방법입니다.

<style>
  .row {
    display: flex;
  }
</style>

할 일

display를 flex로 만드세요

막혔나요?

코드 에디터

<style>
  .row {
    /* display를 flex로 만드세요 */
  }
</style>
<div class="row">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>

미리보기