10
테이블의 td 너비와 높이의 크기를 수정하여 테이블의 나머지 td가 필요에 따라 확장되도록하는 방법을 알고 계십니까?나머지 td가 확장 될 수있는 동안 td 고정 크기 (너비, 높이) 만들기
문제는 td 내부에 데이터가있는 경우 데이터보다 더 축소되지 않지만 비어 있으면 모든 방법으로 축소됩니다. td가 확장되는 창을 확장하면 모든 것이 축소됩니다.
td의 크기를 유지하고 싶습니다. 창을 확장하거나 축소하거나 td의 내부에 데이터가 있는지 여부를 유지하고 싶습니다.
또한 윈도우를 확장 할 때 나머지 td를 확장 할 수 있어야합니다.
클래스 tableContainerRow2는 고정 크기 여야합니다. 예 :
<style>
.divContainer {
margin:10px;
background-color:#C7D8EE;
border:2px solid #0076BF;
text-align:left;
}
.tableContainer {
color:#0076BF;
margin: -10px 0px -10px 0px;
border-spacing: 10px;
empty-cells:show;
width:90%;
}
.tableContainerRow2 {
background-color:white;
border:2px solid #0076BF;
}
</style>
<div class="divContainer">
<table class="tableContainer" cellspacing="10px">
<tr>
<td width="18%" style="white-space:nowrap;" >NHS Number</td>
<td width="17%"> </td>
<td width="10%" style="white-space:nowrap;">Date of Visit</td>
<td width="10%"> </td>
<td colspan="3" style="white-space:nowrap;">Care Time Started</td>
<td width="4%"> </td>
<td width="5%"> </td>
<td width="25%" rowspan="2" style="font-weight:bold;vertical-align:middle;white-space:nowrap;">Tick when<br/> care starts</td>
</tr>
<tr >
<td width="18%" class="tableContainerRow2"> </td>
<td width="17%"> </td>
<td width="10%" class="tableContainerRow2"> 12/12/09</td>
<td width="10%"> </td>
<td width="5%" class="tableContainerRow2"> 12</td>
<td width="1%" > :</td>
<td width="5%" class="tableContainerRow2"> 10</td>
<td width="4%"> </td>
<td width="5%"> ☑</td>
<td width="10%" > </td>
</tr>
</table>
</div>
이 (더 나은 몇 가지 값을) 더 좋을 것이다 CSS를 사용하는,하지만 원칙은 동일합니다 : 인라인 스타일, 또는 ID/클래스 요소에 할당 된 모든 작동합니다. – Richard
귀하의 의견을 보내 주셔서 감사합니다, 나는 어떤 코드를 붙여 넣지 않았을 것 같아요,하지만이 솔루션은 어쩌면 내가 잘못한 일을하지 않았다. – Amra
귀하의 테이블은 모든 지정된 너비로 꽤 무겁습니다. 모든 스타일을 제거하고 처음부터 다시 시작하십시오. 줄 바꿈을 사용하지 마십시오. 머리글 행 셀을 조정하고 여백 공백을 사용하지 마십시오. colspan = "3"대신 colspan = "3"을 사용하여 정렬 된 열을 표시 할 수 있도록 다른 테이블을 사용하십시오. 그래도 퍼센티지를 사용하고 있지만, 원하는 픽셀 너비로 고정 시키려고 했습니까? 테이블이 복잡해지면 항상 서식을 지정하는 것이 어려웠습니다. 디버깅을 위해 한 번에 하나씩 물건을 제거하기 시작하십시오. – spatel