수다닷컴

안녕하세요.^^
테이블을 이용한 코딩을 하다가 궁금한점이 있어서 질문드립니다.
보통 테이블의 width는 브라우저마다 보더와 패딩의 영향을 받아서 다르게 계산이 되서 나오고 하는데, 보더와 패딩의 영향을 받지않고 모든 브라우저에서 동일한 width 로 나오게 할 수 있는 방법이 있을까요..?

예를들어..
td width=30 이라고 지정했을경우 td의 css에 padding:0 5px; border-right:1px solid red; 이런식으로 지정하게되면..
크롬의 경우는 padding이나 border의 영향을 받지않고 30으로 나오지만..
ie나 파폭 오페라의경우는 지정width(30)+양쪽패딩(10px)+border(1px) 이렇게 계산이 되서 나오더라구요.

브라우저마다 렌더링 방식이 달라서 다르게 나온다고는 하지만
혹,통일 시킬수 있는 방법은 없을까요..a

제가 여러가지방법으로 width를 주는 방법을 테스트해봤는데..
우선 제가 width를 테스트해 본 경우는..

1) col에 width를 선언하였을 경우 : 지정width 값으로 출력
2) td or th에 width를 선언하였을경우 : 지정width+padding+border (crome제외)
* width를 %로 지정하는 방법은 현재 작업상황에선 기능구현의 제약이 생겨서, 고정 width일 경우만 다루었습니다.

col에 width를 선언해서 해보니 지정한 값만큼 나와서 참 깔끔하긴한데..
현재로서는 col width를 쓸수있는 상황이 아니라서요..
(개발부분에서 여자처자한 사정으로 인해 막혔습니다;)

테이블만 벌써 몇일째 붙잡고있는데...딱히 이렇다할 해결책이 나오지 않아서..
sos를 요청합니다 ㅠ_ㅠ

width 관련 테스트한 소스 첨부해드립니다.
!doctype html public -//w3c//dtd xhtml 1.0 transitional//en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd
html xmlns=http://www.w3.org/1999/xhtml
head
meta http-equiv=content-type content=text/html; charset=euc-kr /
titleuntitled document/title
style type=text/css
table {border-collapse:collapse; font-size:12px;border-spacing:0px;table-layout:fixed;}
th {padding:0 5px;height:20px;font-weight:bold;border-right:1px solid #ccc; border-bottom:1px solid #ddd; border-top:1px solid #ddd;}
td {padding:0 5px;border-bottom:1px solid #ddd;border-right:1px solid #ddd;}
/style
/head
body
table width=400 border=0 cellpadding=0 cellspacing=0
!--colgroup
col width=5%
col width=15%
col width=5%
col width=15%
col width=15%
col width=*
/colgroup--
!--colgroup
col width=50
col width=50
col width=50
col width=100
col width=50
col width=100
/colgroup--
tr
th width=50scope=col mp;nbsp;/th
th width=50 scope=col /th
th width=50 scope=col /th
th width=100 scope=col /th
th width=50 scope=col /th
th width=100 scope=col /th
/tr
tr
tdtest1/td
tdtest1/td
tdtest1/td
tdtest1/td
tdtest1/td
tdtest1/td
/tr
/table
/body
/html

신청하기