본문 바로가기

Html,Css,JavaScript

tr을 display:none, display:block 할때의 문제점 해결법

<tr style="display:block;"> 을 하게 되면 IE 계열에서는 잘 표현이 되나 여타 브라우저에서는 테이블이 일그러집니다.

그 이유와 해결 방법은 아래와 같습니다.

표준 기반 브라우저에서 tr 요소의 기본 display 속성 값은 block이 아니라 table-row입니다.

그런데 display = "table-row" 이렇게 지정하면 IE에서 제대로 동작하지 않습니다.

그래서 sytle.display = "" 처럼 그냥 빈 문자열("")을 써서 요소의 기본 display 속성 값으로 초기화시키거나
style="display:table-row; *display:block;" 으로 써 주면 됩니다.

크리에이티브 커먼즈 라이선스
Creative Commons License