[CSS] float의 display 수정

 

 

▶ CSS float 참조: developing-move.tistory.com/123

 

- float 속성이 추가된 요소는 display 속성의 값이 대부분의 경우 block으로 수정됨.

 

- <span>의 전형적인 inline 속성. 

 

 

- <span>에 display: block; 적용 시 결과 화면.

 

 

- float: left; 사용.

- display: block;과 마찬가지로 요소의 가로/세로 크기를 가질 수 있게 되고 margin이 적용됨.

 

 

- 대부분의 경우 display 속성의 값이 변경되는 것으로 그렇지 않은 값들도 있음.

지정 값	변화 값
inline	block
inline-block	block
inline-table	block
table-row	block
table-row-group	block
table-column	block
table-column-group	block
table-cell	block
table-caption	block
table-header-group	block
table-footer-group	block
flex	flex(float 속성 효과 없음)
inline-flex	inline-flex(float 속성 효과 없음)
그 외	변화 없음