IE 버그 몇가지

잘 되다가도 IE 를 만나면 레이아웃이 깨지거나 안맞을 때가 있습니다. 그래서 정리해봤습니다. 비공개글인데 그냥 공개합니다. 따로 더 정리하려고했는데. 자꾸 글이 뒤로 밀리는바람에 걍 송고함^^;
  • IE (ie 6.0)의 margin 버그.
float 와 margin 이 방향이 같을때 margin이 두배로 나오는 현상이 있을때가 있습니다. 예를들어 float:left margin-left:10px 라고하면 왼쪽으로 margin이 20px 로 나올때가 있습니다.
마찬가지로 float:right; margin-right:10px; 라고해도 같은 현상이 나올때가 있습니다. 이럴때 해결방법 display:inline 를 추가해주세요.

  • IE에서 letter-spacing:-1px; 적용시 br 태그 버그
스타일에서 letter-spacing:-1px; 을 줬을경우 입니다.
ex) body {letter-spacing:-1px;}
위와 같을때 IE에서 br 태그 두번 적용시 한칸으로 인식해버립니다. (IE8 제외)

css 기본정의시 아래와 같이 삽입
br {letter-spacing:0;}
  • IE6에서 border 속성
IE6에서 border:none; 로 했을 경우 보더값이 남아있는 현상이 있더군요.
이럴경우 border:0; 으로 해야 보더값이 없어집니다.

  • li 에서 이미지와 이미지 사이에 여백이 생기는 문제
<ul>
<li><img src="이미지경로" alt="" /></li>
</ul>

위와 같이 했을경우 가끔 이미지와 이미지 사이에 여백이 생기는 경우가 있습니다. 
이럴때는 해당 css 에 

       ul li img {
            display: block;
        }

이런식으로 display:block; 를 추가해 주시면 됩니다.
위 방법으로 안될경우 li img {vertical-align:top;}  이렇게 해보시면 됩니다.
개    개