<td>
<div id="test">...</div>
</td>
<td>
.....
</td>
td가 "test"div (너비 + 테두리 + 여백 모두 포함)보다 약 40px 넓어 보이지만 CSS 스타일은 없습니다. 이 (너비, 패딩 설정 없음)!div 안에 div가 있지만 예상치 않게 확장되었습니다.
여기서 "td"가 div만큼 넓지 않은 이유는 무엇입니까?
나는 이제 "test"div만큼 넓어 지지만, 불편 함을 느낄 정도로 하드 코딩하고있다.
나머지 코드가 없으면 여기 <td>은 표의 너비/열 수에 따라 자동으로 크기가 조정됩니다. 테이블에 명시적인 너비가 지정되어 있지 않으면 컨테이너 또는 부모 요소의 너비가 100 %로 확장됩니다. 테이블에 명시적인 너비를 설정하거나 필요에 따라 표 셀을 설정하여이 문제를 방지 할 수 있습니다.
다음 시나리오에서는 각 열이 표 폭/열 수 또는이 경우 400/4 = 100으로 자동 조정됩니다. 따라서 각 열은 100px 너비입니다.
<table style="width:400px">
<td></td>
<td></td>
<td></td>
<td></td>
</table>
이 시나리오에서는 브라우저에 따라 두 가지 결과가 발생할 수 있습니다. 1. 표는 부모의 너비 100 % 또는 여기 600px로 확장됩니다. 즉, 각 열은 150px 너비의 자동 크기가됩니다. 2. 테이블과 열은 열 그룹에서 가장 넓은 하위 요소의 너비까지 확장 될 수 있습니다.
<body style="width: 600px"> <!-- Could be a div or other element here -->
<table>
<td></td>
<td></td>
<td></td>
<td></td>
</table>
</body>
WC3 사양은 here을 발견하고 브라우저가 테이블에 관해서의 HTML 4.01 사양을 구현하는을 가정 입니다 방법에 대한 몇 가지 훌륭한 세부 사항을 제공 할 수 있습니다.
td 너비를 지정하지 않고 자동 크기 조정은 어떻게 수행됩니까? 어떻게 든 자동 응답을 트리거했습니다. td (s)의 내용에 따라 다른 너비가 지정되었습니다. 그런데 어떻게 끝났습니까? – omg
브라우저는 WC3 권장 사항에 따라 테이블 열의 자동 크기 조정을 관리합니다. 사양은 http://www.w3.org/TR/html401/struct/tables.html#h-11.2.4.4에서 확인할 수 있습니다. – PortageMonkey