float

[css] css스타일 예제로 여러가지 요소의 속성 알아보기 (float, margin, box-sizing, last-child)

box3개를 inner안에 쏘옥쏙쏙 가운데정렬 해보기! box_1 box_2 box_3 div class="wrap" - 화면 전체 div class="inner" - 컨텐츠를 감싸주는 역할 ul class="boxList" - 컨텐츠 요소들을 감싸는 부모 li - 실질적 컨텐츠로 보여질 자식 구조화만 완료했을때 보여지는 모습 먼저, 생각해야할 조건들은 wrap 을 화면비율 100%설정 inner 를 80%로 할것 ul 은 inner에 꽉차게 li 는 ul의 한 줄 안에 동일비율로 나열하되, 요소사이의 margin여백을 줄것 일단 ul.boxList 의 영역을 설정해주며 가운데 정렬을 해보자. .wrap{ width: 100%; } .wrap .inner{ width: 80%; margin: 50px a..