box-sizing

	box-sizing: content-box(기본값)
	- width:100% : 패딩과 보더 **제외**!!!! 그래서 스크롤이 생겨버린다!!
	-> 그래서 걍 안쓰면 됨...?

	box-sizing: border-box(보더까지 width에 포함)

	section div.. 등을 inline-block 했는데 안붙는 이유
	- 그 사이의 공백문자가 있기 때문
	-> 해결 : 부모 {font-size: 0} 으로 하면 된다!!
	-> ✨그 후 자식요소들을 {font-size: 1rem} 하면 끝

	rem : html이 정한 기본 폰트 사이즈, 1rem이 기본


	---

{vertical-align: }

	vertical-align : top

	.container{
		//브라우저 너비가 1000px을 넘어가면 고정, 그 안에는 자유롭게
		max-width: 1000px;
		//양옆 여백 나눠 갖기
		margin-left: auto;
		margin-right: auto;
	}

	---

{float: }

	float: left ... 를 하면
	-> ✨✨자식들이 float면, ✨✨✨부모는 {height: 0}
	-> float: 붕 ~ 떠있는 것이기 때문에 부모는 이 자식을을 품고 있다고 인지를 못한다!!

다음 요소 : style="clear: both"

	### 옛날 방법
	- 반드시 다음 요소를 ✨✨<div style="clear: both"></div> 한다!!!

	### 현재 방법 : <부모:after {}> 가상 요소 추가
	- ✨✨
	.container:after{
		content: '';
		display: block;
		clear: both;
		//혹시 모르니 추가하는 아래것들
		height: 0;
		visibility: hidden;
	}

@media

	=======반응형
	@media : 미디어쿼리
	---
	@media screen and (min-width: 700px){
	//screen / 너비가 최소 700px(700px 이상)일때 아래 코드 실행
		.item{
			display: inline-block;`
		}
	}

마진

마진