2011-04-18 1 views
0

나는 수년 동안 올바르게 작동했지만 최근에는 테이블 너비가 다소 엉성한 것으로 나타났습니다. 그것은 유지하지만 (CSS로 다시 작성해야합니다) 작성하지 않은 오래된 HTML 사이트이지만 소유자는 아직 그것을하고 싶지 않고 매우 큰 사이트입니다.중첩 된 HTML 표 - 너비 = x %가 더 이상 올바르게 작동하지 않음

테이블 구조는 변경되지 않았지만 width = x %는 더 이상 올바르게 작동하지 않습니다. 나는 테이블이 지저분하고 지나치게 복잡하다는 것을 안다.

나는 이것을 봤다. 나는 쉽게 빠진 것을 알고있다. 테이블에 몇 가지 오류가 있지만 최근까지 (클라이언트가 며칠 전에 알아 차릴 때까지) 렌더링 엔진이 제대로 표시하지 못하게했습니다.

정확한 문제가 중첩 테이블은 X %, 25 %, 25 %를 기준으로 공간을 할당되지 않은 (이하 * 문제 참조)이다. x %는 50 %보다 약간 낮지 만 두 외부 열은 각각 25 % (브라우저가 충분히 큰 경우)이어야하며 동일하게 확장하는 데 사용됩니다. 이제는 왼쪽 열이 항상 오른쪽 비례보다 크고 브라우저의 크기에 따라 가운데가 확장 및 축소되지만 오른쪽 열은 항상 너무 작아서 복잡합니다.

코드 사용으로 불편을 끼쳐 드려 죄송합니다. 그것은 지저분한 테이블이고 나는 외계인이라고 생각했던 것을 자르고 싶었지만 구조를 남겨 두었습니다.

내가 곤혹 스럽다. 어떤 도움을 주시면 감사하겠습니다.

CLARIFICATION. 이 테이블에는 3 개의 중첩 테이블이 있습니다. 이 3 개의 테이블은 브라우저 창의 크기를 변경하면서 크기를 조정하는 데 사용되었지만 이제는 3 개 중 2 개만 확장됩니다. 가장 왼쪽 및 중앙 테이블은 전체의 일부로 확장 및 크기 조정됩니다. 맨 오른쪽의 중첩 테이블은 더 이상 확장되지 않으며 지정된대로 25 % 너비 임계 값 아래로 줄어 들었습니다. 이것은 새로운 현상이지만 기본 코드는 변경되지 않았습니다 (1 년 된 페이지 사본에서 확인 됨).

<table width="100%" height="500" border="0" align="left" cellpadding="0" cellspacing="0"> 
     <tr> 
     <td colspan="5" height="54" align="left" valign="top" bgcolor="#FFFFFF"><br /> </td> 
     </tr> 

     <tr> 
     <td colspan="5" height="21" align="left" valign="top" bgcolor="#FFFFFF"><some images><br /> </td> 
     </tr> 

     <tr> 
     <td colspan="5" height="25" align="left" valign="top" bgcolor="#FFFFFF"><br /> </td> 
     </tr> 

     <tr> 
     <td colspan="3" width="100%" height="1" align="left" valign="middle" </td> 
     </tr> 
     <tr> ************PROBLEM STARTS HERE *************** 
     <td colspan="1" width="25%" height="485" valign="middle" align="right" > 
      <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> 
       <tr> 
        <td align="right" valign="middle"> 
         <p class="x"> 
          <a href="#"></a><br /> 
          <a href="#"></a><br /> 
         </p> 
        </td> 
        <td width="15" align="right" valign="middle"></td> 
       </tr> 
      </table></td> 

     <td colspan="1" height="450" width="1" valign="top" align="right" </td> 
     <td colspan="1" height="485" align="center" valign="top"> 
      <table width="100%" border="0" valign="top" align="center" cellpadding="0" cellspacing="0"> 
       <tr> 
        <td colspan="1" height="485" align="center" valign="middle"></td> 
       </tr> 
      </table></td> 
     <td colspan="1" height="450" width="1" valign="top" align="right" </td> 
     <td colspan="1" height="485" width="25%" valign="middle" align="right" bgcolor="#84968A"><table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> 
      <tr> 
       <td width="15" align="right" valign="top"></td> 
       <td align="left" valign="middle"> 
        <p class="x"> 
         <a href="#"></a><br /> 
         <a href="#"></a><br /> 
        </p> 
       </td> 
     </tr> 
     </table></td> 
     </tr> 
</table> 
+1

'문제는 여기에서 시작됩니다.'와 같이 'tds'가 닫혀 있습니다. 그것들을 닫고 결과를 확인하십시오. 또한 td는 colspan = 5 일 수 있습니다. – manji

+0

예 - 깨진 HTML. 15 번 라인. –

+0

테이블. 내 머리 아파. – bpeterson76

답변

0

사실, 문제는 "문제는 여기서 시작"이 경우 위의 행에있다 : 당신은 3 열 너비의 100 %임을 말하고있다

<td colspan="3" width="100%" height="1" align="left" valign="middle"> </td> 

. 그런 다음 다음 행에 5 개의 셀이 있습니다.

+0

답장을 보내 주셔서 감사합니다. 사실 그것은 그것에 영향을 미치지 않습니다. 열 수를 다시 정의 할 수 있습니다. 나는 그것을 재미로 5로 바꿔 보려고했지만 아무런 효과가 없었다. 맨 왼쪽과 가운데 열이 가장 많이 붙어있는 오른쪽을 확장하고 있습니다. 다른 흥미로운 점은 그 테이블이 수년간 일 해왔다는 것입니다. 방금 새 브라우저에서 엔진 변경 사항 렌더링으로 인해 방금 파산했습니다. – DevToo

+0

감사합니다. 당신 말이 맞아요. 전에 그걸 수정했을 때 무슨 일이 있었는지 모르겠지만 어떤 이유로 업데이트되지 않았거나 캐시에서 지워지지 않았습니다. 그 하나의 변화는 다른 모든 것을 시도한 후에 차이점을 만들었습니다. 감사합니다. 그것에 관해 최악의 부분은 내가 오래 전에 시도했기 때문에 많은 시간을 절약 할 수 있었다는 것입니다 ... LOL 나는 또한 그것이 왜 그렇게 작동했는지 이해하지 못합니다. 나는 2008 년 8 월부터 오래된 복사본을 확인했고 colspan = 3이라고 말했습니다. 지금 왜 고장 났는가?하지만 모든 브라우저는 기한이 없습니다 (IE 8/9, FF 3.6, Chrome, Safari, 기타 – DevToo

관련 문제