나는 5 개의 열이있는 테이블을 가지고 있는데 그 중 2 개는 너비가 설정되어 있고 나머지 세 개는 그렇지 않습니다. 서로 다른 브라우저가 일관성이없는 것으로 해석합니다.빈 셀의 너비는 고정되어 있습니까?
다른 브라우저에서 this fiddle을 확인하십시오.
파이어 폭스와 IE9는 올바른 방식으로 렌더링합니다. 모든 셀의 폭은 20 % (두 개는 각각 20 %의 너비가 설정되고 나머지 60 %는 나머지 세 개의 셀로 나뉩니다)라고합니다.
크롬, 오페라, IE7 및 IE8은 너비가 0이되도록 빈 너비를 설정하고, 나머지 두 셀을 각각 50 % 너비로 늘립니다. 세 개의 빈 셀 중 하나에 내용을 넣으면 사용 가능한 모든 너비 (한 셀에 내용이있는 경우 60 %, 두 개이면 30 % 등)를 사용할 수 있습니다. 마찬가지로, 너비가 설정된 두 셀 중 하나에서 내용을 제거하면 강제로 너비가 0이됩니다.
어떤 브라우저가 올바르게 만들었고 어떤 브라우저가 잘못 했습니까?
또한 테이블에 관한 W3C 사양을 살펴 보았지만 테두리/배경이있는 빈 셀 렌더링을 제어하는 것으로 가정 된 description of the empty-cells property 만 발견되었지만 셀의 너비에는 영향을주지 않습니다. 나는 table-layout property이 트릭을 할 수도 있다고 생각했지만, 크롬에서 table-layout:fixed을 설정하면 모든 열이 나타나지만 Firefox에서는 그 반대의 경우 (적어도 하나도 보이지 않습니다)는 없습니다. 만약 당신이 이것을 상세히 설명 할 수 있고 그리고/또는 이것을 다루는 W3C 스펙의 정확한 부분을 지적 해 주시면 고맙겠습니다.
단지'table td {width : 20 %; }'? – Ben
이상한 행동을 발견하고 그 원인에 대해 더 알고 싶습니다. 나는 결코 내가 무엇인가 문제가 있다고 말하지 않았다. – mingos