IE의 버그입니다.
의도된 버그인지는 모르겠으나, IE 는 DTD 앞에 어떠한 문자가 오면 반드시 IE 는 quirks mode 로 동작합니다. 즉 IE 를 standards mode 로 동작시키고 싶으시다면, DTD 앞에 어떠한 문자도 오면 안됩니다.
따라서 <?xml 로 시작하는 일련의 문자열이 DTD 선언 앞에 나오기 때문에, IE 는 그 문서를 quirks mode 로 처리하게 됩니다. padding 처리 등의 자잘한 차이점이 있다는 건 아실테고..
전에 w3.org 에서 관련 글을 보았었는데... 지금 찾질 못하겠네요.
xhtml dtd 선언에서 보면, w3c 에서는 분명히 dtd 앞에 xml 문서임을 뜻하는 <?xml ... 선언을 해주기를 _강력히 권장_ 하고 있습니다. 하지만 그 문서에서도 밝히듯이 IE 는 버그로 인해 선언하면 바라던 바를 이룰 수 없기에 IE 를 생각한다면 빼줘야 한다..는 식으로 언급되었던 기억이 얼핏 나네요. 표현은 조금 다를 수도 있습니다.
http://www.w3.org/International/articles/serving-xhtml/
여기도 본문 중에 섞여서 등장합니다..
그리고 xhtml 문서의 헤더를 뭘로 해야하는가.. 에 대한 문제도 미묘합니다.
application/xhtml
application/xhtml+xml
text/xml
text/xhtml
등등... 저도 몇 가지 문서를 읽어 봤는데 도통 헷갈려서....
현석님의 최근 블로그 글 중 저것에 대해 꽁수 처리한 걸 본 기억이 나네요.
p.s
위에 언급한 문제로 인해, 실무자들은 영문도 모른채 삽질을 반복합니다.
지금 국내 회사 사이트들 중에 보면 예전에 비해선 DTD 선언하는 곳들이 상당히 많이 늘었습니다. 그런데 DTD 는 맞더라도, include 하거나 또는 기타 업무의 협업 과정 중에 생긴 것 등으로 인해, DTD 위에 JS 스크립트가 들어가거나 주석이 있는 경우가 종종 발견 됩니다. 만약 개발 중에 DTD 선언 위에 문자 하나도 없이 출력 되었다면, IE 에서 테스트할 땐 분명히 standards mode 로 동작하므로, padding 등의 처리가 표준 모드에 맞게 처리되지만, 작업 중 DTD 상단에 주석 등의 문자가 포함된다면, 갑자기 기존에는 잘 맞던 이미지들이 조금씩 틀어지는 결과를 보게 됩니다. 디자이너는 당황하고, 다시 맞추느라 삽질을 합니다. (이유는 물론 알 리가 없습니다! 오 쉣, 그런 걸 누가 가르쳐 주던가요?? HA)
고치던 중에 프로그래머가 또 소스 수정하다가 DTD 앞에 문자가 사라진다거나 하면 또다시 틀어집니다. 네에, 이 후의 일은 굳이 말하지 않아도 아시리라 믿습니다(..야근할까용?). 테스트 결과 DTD 앞의 공백(엔터, 스페이스)은 IE에서 무시하는 걸 확인 했습니다. 즉 그냥 white space 에 해당하는 문자라면 상관이 없는 듯 합니다.
테이블로 짜면 그나마 padding 의 문제에서는 div 레이아웃 보단 덜 영향을 받을 수도 있겠지만, 여하튼 국내 실무자는 90% 이상이 이 문제를 모르기 때문에, 오늘도 끝없는 삽질은 반복됩니다. 그나마 이 문제를 인지하고 있는 경우라면 굉장히 다행입니다.