[CSS3] 구버전의 IE(8 이하)에서 시맨틱 태그 호환

 구버전과 호환시키기 위해서 대기업들은 HTML5 표준보다는 그냥 div로 나누고 만다.

모든 원흉은 마이크로소프트

HTML5를 지원하지 않는 구버전의 브라우저에서는 시맨틱 태그같은건 모른다. 그렇기 때문에 자신이 원하는 웹페이지의 레이아웃대로 정렬이 안될 수도 있는데.

이를 '어느정도'는 원하는 대로 보여지게는 하고 싶을 수도 있다.

(간단한 페이지면 적용해보아도 괜찮다.)

웹 브라우저가 모르는 태그의 경우에는 display값이 inline으로 설정된다.

하지만, 시맨틱 태그들의 경우에는 레이아웃을 나누는데 사용하므로 기본 값이 block이다.

이 점에서 호환이 안되고 레이아웃이 망가지는 등의 문제가 발생할 수 있는데.

이를 스타일로 display를 block으로 명시를 해주면 된다.

1 2 3 4

header, nav, section, article, aside, footer {      display:block; }   Colored by Color Scripter

cs

사실 그래도 호환성은 보장할 수 없다만, 어느정도는 보완이 가능한데에 의의를 두자.

그리고 정말 왠만하면 그냥 새 브라우저를 설치하라고 권유하도록 하는 것이 좋다.

또한, 해당 스타일이 가장 우선순위가 낮게 하기 위해서 스타일의 상단에 위치시키도록 하자.

---

솔직히 어짜피 요새 IE8이하는 소수다.

실무 프로젝트에서 div로 하라던지 하는 말이 없고 그냥 개인적으로 개발을 한다던지 하면 그냥 표준 지키자.

본인들이 시대를 따라와야지. 언제까지 구시대 유물까지 지원해주어야 하나.