float

자식 요소에 float을 사용하면 부모 요소가 자식을 감싸지 못하고 높이를 잃어 버린다.

해결 방법

• 가상 요소 :after 사용 (권장)
• overflow 사용

부모 요소에 아래와 같은 속성을 주면 된다.

.parent:after { 
	content: ''; 
	dispaly: table; 
	clear: both ;
}

검색 키워드 : float, clearfix

참고 : https://takeuu.tistory.com/60

z-index

z-index만 사용했을 때 속성이 적용되지 않는다.

해결 방법

• z-index를 사용할 땐 position 속성이 static일 땐 z-index가 적용이 안된다. 그런데 div의 기본 position이 static이기 때문에 항상 아래처럼 다른 position 속성을 같이 넣어 주어야한다.

.content {
	position: relation;
	z-index: 10;
}