본문 바로가기
웹표준

브라우저 버그 해결 기초

by 샷타이거 2009. 9. 10.

브라우저 버그 해결 기초 개녑 잡기

문서를 다 작성후 브라우저에서 적용시켜보면 문제가 발생한다.이런 버그(bug)를 해결하기 앞서 기초 부터보자.

가장 기본적으로 일어나는 문제는 문서가 제대로 작성되지않았을 경우이다. 엘리먼트에서 " /" 이라던가 " >"

등 빼먹었을떄 당연히 문제는 일어난다. css경우도 마찬가지다.그래서 문서작성을 마치면 반드시 유효성검사를 해볼필요가있다.

html의 유효성검사

css의 유효성검사

IE 레이아웃..

IE는 특별나게 "레이아웃"이라는 개념을 사용한다.레이아웃을 가지는 엘리먼트는 다음과 같다.

body, html, table, tr,td,img,hr,input,select,textarea,button, iframe, embed,object,applet,marquee

엘리먼트가 레이아웃인지아닌지 확인하는방법은 hasLayout라는 자바스크립트로 확인할수 있다.

미리 말하지만 지금말하는 haslayout이라는 개념은 css우리가 흔히 말하는 layout 과 다르다. 앞서말했듯이 haslayout은 익스플로어에서 문서를 읽어들일때 사용하는개념이다

또 css를 다음과 같이 지정하면 레이아웃이라 인식한다

Layout을 갖게 만드는 CSS 속성
  • position: absolute
  • float: left|right
  • display: inline-block
  • width: ‘auto’ 외의 모든 값
  • height: ‘auto’ 외의 모든 값
  • zoom: ‘normal’ 외의 모든 값 (IE 전용)
  • writing-mode: tb-rl (IE 전용)
  • overflow: hidden|scroll|auto (IE7만 적용됨)
  • overflow-x|-y: hidden|scroll|auto (IE7만 적용됨)

IE 버그는 이런 layout인식 문제 떄문에 여러가지가 일어난다 다음부터 하나하나풀어보자


댓글