티스토리 뷰

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;
}


완료.



공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/03   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
글 보관함