Mozilla 한국 커뮤니티

요즘들어 불여우에 관심을 가지고 있는데.. 재밌네요..

한가지 궁금한점은
div 태그내에 스타일 포지션을 absolute로 했을때 ie와 왜 다르게 나올까요?
ie는 div내의 위치를 찾고 불여우는 전체 절대적 위치는 찾는것 같은데요..

해결책은 무엇인지요..
style="position:absolute; right:2px; top:-20px; visibility:view"

pakino wrote: div 태그내에 스타일 포지션을 absolute로 했을때 ie와 왜 다르게 나올까요?
ie는 div내의 위치를 찾고 불여우는 전체 절대적 위치는 찾는것 같은데요..

해결책은 무엇인지요..
style="position:absolute; right:2px; top:-20px; visibility:view"

IE가 CSS 표준을 잘못 해석하고 있습니다. work-around가 있기는 있는데, 지금 생각이 잘 안 나네요

position: absolute 는 상위 container block 에 영향을 받습니다.

상위 div 에 position: relative 를 설정해 주면 됩니다. div 의 position default 값이 static 이기 때문입니다. 상위 element 가 꼭 div 일 필요는 없습니다. (CSS layout 이라면 일반적으로 div 이겠지만 table layout 일때는 td 가 되겠죠.)

추가로 visibility 에는 view 라는 값이 없습니다. visible 이 맞습니다.

--------------------------------------------------------------------

아..그리고 추가로...IE 는 container block 에 width 나 height 를 설정해 주어야 position 이 정상적으로 작동하는 버그가 있습니다.

width 를 지정할 수 없는 상황이라면

* html div.container-block {
height: 1%;
}

와 같이 CSS hack 을 사용해서 해결 할 수 있습니다.

pakino wrote:요즘들어 불여우에 관심을 가지고 있는데.. 재밌네요..

한가지 궁금한점은
div 태그내에 스타일 포지션을 absolute로 했을때 ie와 왜 다르게 나올까요?
ie는 div내의 위치를 찾고 불여우는 전체 절대적 위치는 찾는것 같은데요..

해결책은 무엇인지요..
style="position:absolute; right:2px; top:-20px; visibility:view"

IE와 불여우에서 CSS 사용시 최대한 차이를 줄이려면 xhtml dtd 선언이
최고라고 봅니다. 그러면 대부분 IE와 불여우 똑같이 나옵니다.
간혹 익스가 지원 못하거나 버그인게 있지만 그래도 선언하지 않은것에
비해서 훨씬 낫습니다.

박민권 wrote:xhtml dtd 선언이최고라고 봅니다. 그러면 대부분 IE와 불여우 똑같이 나옵니다.

XHTML 뿐만 아니라. HTML 4.01 st, tr, fr 등을 선언해도 됩니다.

독타입 스위칭(doctype swiching) 이라는 기능인데요. IE6 는 DTD 를 정확히 설정을 해주면 표준 모드로 랜더링이 됩니다. DTD 가 없으면 호환모드로 돌아가고요.

DTD 선언을 해주면 웬만큼은 잘 됩니다.

단점은...IE5.5 이하 버젼은 이런 기능이 없어서 IE6 에 맞추면 레이아웃 설정이 힘듭니다. 이 독타입스위칭 때문에 DTD 선언을 안하겠다는 사람들도 있더군요. (ㅤㅋㅝㄱ스모드.org)

뭐..DTD 는 선언을 해줘야죠. ^^

근데 잘 돌아가는 사이트에 DTD 를 넣으면 와장창 깨질지도 모르니 주의....padding 만 신경쓰면 됩니다. IE5 도 어느정도는 CSS 를 지원하니까...