CSS3•
구버전의 IE(8 이하)에서 시맨틱 태그 호환
Table of Contents
이 글은 이전 티스토리 블로그에서 글을 가져와서 일부 수정하였습니다.
최초 작성일 : (2017. 2. 2. 09:39)
서론
현재 구버전의 IE 8 정도를 일상에서 사용하는건 심했습니다…
이게 도움이 될 일이 거의 없을 것 같기는 합니다.
HTML5를 지원하지 않는 구버전의 브라우저에서는 시맨틱 태그를모른다. 그렇기 때문에 자신이 원하는 웹페이지의 레아아웃대로 정렬이 안될 수도 있는데.
이를 '어느정도’는 원하는 대로 보여지게 하고 싶을 수도 있다.
웹 브라우저가 모르는 태그의 경우에는 disply값이 inline으로 설정된다.
하지만, 시맨틱 태그들의 경우에는 레이아웃을 나누는데 사용하므로 기본 값이 block이다.
이 점에서 호환이 안되고 레이아웃이 망가지는 문제가 발생하는데. 이에 대한 스타일을 명시해주면 된다.
header, nav, section, article, aside, fotter {
display: block;
}
또한, 해당 스타일이 가장 우선순위가 낮게 하기 위해서 스타일의 상단에 위치시키도록 하자.