dev/web

tr,td align속성 상속현상

재삐신생 2012. 4. 30. 18:36
반응형

또또 IE의 문제점을 보고하게 되었습니다.


스타일 최적화를 하는 과정에서

TH의 기본정렬은 center

TD의 기본정렬은 left



TR에 정렬을 적용하면 하위TD에 정렬이 적용되는 건 EASY합니다.


하지만 문제점은 이것이었습니다.

<table width="100%">

<tr align="center"><!-- 여기에서 가운데 정렬지정 -->

<td>

<table width="100%">

<tr>

<td>

문제! : 여기의 정렬은 왼쪽일까요? 오른쪽 일까요?

</td>

</tr>

</table>

</td>

</tr>

</table>


예전 코드들이라 테이블로 레이아웃을 잡았죠, 아!!ㅠㅠ

아무튼, 아직 접할 기회가 많네요;


오늘 간단하게 실험을 해본결과 저런 상황일때

DTD xhtml 1.0으로 잡고 해봤슴다.



IE9 쿼크 IE9 표준 크롬 18.0.xx 파폭 12 사파리 5.1.5
왼쪽 가운데 왼쪽 왼쪽 왼쪽

놀랍지 않습니까??ㅠㅠ

이것때문에 시간을 얼마나 버렸는지!!


align속성이 상속되어버립니다;ㅠㅠ

IE표준모드에서만 문제가 생기더군요!! 어처구니가 없었네요

align속성이 td에 있어도 같은 현상이 발생합니다.

style="text-align:center;"을 하면 똑같이 가운데로 나오네요;//이건 상속되어버리니까요;


크로스 브라우징을 위해, align속성 사용을 자제하는게 속편할 것 같습니다.ㅠㅠ


css 최상단에 td{text-align:left;} th{text-align:center;}로 RESET시키고!!

가운데 정렬이 필요한것과, 오른쪽 정렬이 필요한것을 찾아서 처리했네요.


align속성 다 찾아서 바꾸나, 저렇게 하나, 손많이가는건 똑같네요.

아 망할 table.......

반응형

'dev > web' 카테고리의 다른 글

DTD때문에 짜증나~!!  (0) 2012.05.20
디자인과 컨텐츠의 분리!  (0) 2012.05.10
[JS] 점선 테두리 제거 스크립트 분석  (0) 2012.04.27
[HTML] b태그와 strong태그의 차이  (0) 2012.04.26
자바스크립트 리퍼러에 대해서  (0) 2012.04.13