컴퓨터잡담

float 문제, Image 밑으로 본문을 새로 줄바꿈해서 출력하려면.

by 디케 posted Dec 08, 2010
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

크게 작게 위로 아래로 댓글로 가기 인쇄

float 문제 해결책. 

Image 밑으로 본문을 새로 줄바꿈해서 출력하려면.




1.JPG


아무리 이미지 아래로 본문을 새로 줄바꿈을 하려고 해도 안된다.
이유인즉 그 테마 자체의 css에 이미 div 요소 등이 float을 포함하고 있기 때문이다.

그렇다면 이미지 아래에 어떻게 본문을 새로 줄바꿈해서 출력할 수 있을까?

방법은 간단하다. 이미지와 분리하고 싶은 본문을 div로 씌운 다음에, 그 div의 시작 태그에 다음과 같이 CSS를 적용한다.

div style="float: none;"

설명하자면, 기존의 스타일 적용값 중에서도 float 속성을 사용하지 않겠다는 말이다.

* 이 팁은 브라우저의 종류에 따라서 원하지 않는 레이아웃이 출력될 수 있다.

* IE6.0에서는 잘 안되는 경우가 있는데, 이를 해결하는 팁은,
원래 하나 뿐이 div의 바깥을 다시 한번 더 div나 span으로 감싼 다음에
div class="none" style="float: none" 를 적용하면 잘 보인다.