ie6, ie7과 호환성 문제

홈페이지에 퀵메뉴를 따악 넣고 크롬과 파이어폭스에서 확인했을때는 완벽했다.

그런데 ㅠㅠ 마지막에 익스플로러에서 봤는데 문제가 따당!!

Div안에 넣은 Div가 밖으로 튕겨 나가서 오른쪽으로 밀려나가 있었다.

처음엔 ie8에서의 문제 인 줄 알고 찾아다녔는데 알고보니 ie7, ie6에서 일어난 문제였다.

난 당연히 내 익스플로러 버전이 8이니까 8에서의 문제인 줄 알았는데 하하

F12(개발자 도구)로 직접 호환성 검사를 하면서 알게되었다.( 익스플로러 자체 호환버튼 으로는 자세히 확인을 할 수가 없었으니까.)

하여튼 그래서 해결하려고 구글을 뒤지다가 CSS 핵을 발견했고 적용을 했다.

그런데 처음에는 적용도 안되고 달라지는 것도 없어 보였는데, 

어느샌가 잘 되었다. ㅋㅋ

아 뿌듯뿌듯. CSS 핵을 쓰는게 좋지 않다는 소리도 있었는데... 어쩌겠나 ㅠ.ㅠ 급하게 해결을 해야하는데..

ie6와 ie7에서의 문제라는것을 알았기 때문에

IE 6, 7 핵(dot hack)

div{.width:100px; .height:50px;}

프로퍼티의 가장 앞부분에 닷(.)를 붙이면 IE6, 7에서만 적용이 됩니다.

이걸 적용했다. 어긋난 만큼 왼쪽으로 옮겨 주기 위해서

.margin-left:-43px;

를 해줬더니 완성!

ie6, ie7 빼고는 다른 브라우저에서는 모두 다 잘 되었었으니까~

더 많은 IE 핵을 보려면 http://jsunnylab.tistory.com/21 이 곳에서 보시길 추천한다.