05 CSS로 Positioning 하는 법을 알아보자 - clear:both

05 CSS로 Positioning 하는 법을 알아보자 - clear:both

clear:both는 특정 객체가 깨끗하게 한줄을 전부 차지하도록 하는 속성이다

아래와 같이 flot:left로 되어있던 객체들을

아래와 같이 article3이 한줄을 모두 차지하도록 바꾸어 보자.

#article03을 보자. position속성을 clear:both로 주었다.

section{
	width:300px;
}
#article01{
	float:left;
	width:100px;
	height:100px;
	background:#3E454C;
}

#article02{
	float:left;
	width:100px;
	height:100px;
	background:#2185C5;
}

#article03{
	clear:both;
	width:100px;
	height:100px;
	background:#7ECEFD;
}

#article04{
	float:left;
	width:100px;
	height:100px;
	background:#FFF6E5;
}

#article05{
	float:left;
	width:100px;
	height:100px;
	background:#FF7F66;
}

완료.