From a5fcfafb665e96cae5d04dfba927db8dcdfd7f14 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Sun, 13 Dec 2020 17:16:08 -0500 Subject: 2020-12-13 --- .../aligning_items_in_a_flex_container/index.html | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) (limited to 'files/ko/web/css') diff --git a/files/ko/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html b/files/ko/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html index 677cf2fdaf..ee66eb7b65 100644 --- a/files/ko/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html +++ b/files/ko/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html @@ -5,14 +5,12 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Contain ---

{{CSSRef}}

-

flexbox가 웹 개발자들의 관심 받게된 이유 중 하나는 웹 최초로 최초로 적절한 정렬 기능을 제공했기 때문입니다. flexbox의 수직 정렬 기능을 이용하여 우리는 드디어 쉽게 박스(역주: 여기서 박스는 flex 컨테이너를 의미합니다)  내부를 중앙 정렬 할 수 있게 되었습니다. 이 가이드에서 우리는 flexbox의 정렬 및 끝 마추기 기능에 대해 자세히 살펴볼 것입니다.

+

flexbox가 웹 개발자들의 관심 받게된 이유 중 하나는 웹 최초로 최초로 적절한 정렬 기능을 제공했기 때문입니다. flexbox의 수직 정렬 기능을 이용하여 우리는 드디어 쉽게 박스(역주: 여기서 박스는 flex 컨테이너를 의미합니다)  내부를 중앙 정렬 할 수 있게 되었습니다. 이 가이드에서 우리는 flexbox의 정렬 및 끝 맞추기 기능에 대해 자세히 살펴볼 것입니다.

박스 내부를 중앙 정렬 하기 위해 박스에 align-items 속성을 지정하면 교차 축에 대해 flex 항목을 정렬할 수 있습니다. 아래 경우, 교차 축은 수직 축입니다. justify-content 속성을 지정하면 flex 항목을 주축에 대해 정렬 할 수 있습니다. 아래 경우, 주축은 수평 방향입니다.

A containing element with another box centered inside it.

- -

아래 예제의 코드를 살펴보세요. flex 컨테이너(역주: .box로 지정된 div 태그)나 flex 항목(역주:  .box div로 지정된 div 태그)의 크기를 조절해도 flex 컨테이너 내부는 중앙 정렬됨을 보실 수 있습니다.

{{EmbedGHLiveSample("css-examples/flexbox/alignment/intro.html", '100%', 700)}}

-- cgit v1.2.3-54-g00ecf