2008-10-30 3 views
0

FireFox3/Opera/Safari에는 잘 표시되지만 IE7에는 표시되지 않는 HTML이 있습니다.HTML 표 열 높이입니다. IE에없는 Firefox에서 작동합니다.

<!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></head> 
    <body bgcolor="#AA5566" > 
    <table width="100%"> 

     <tr> 

     <td height="37" valign="top"><img style="float:right;" border="0" src="foo.png" width="37" height="37"/></td> 

     <td width="600" rowspan="2" > 
      <table width="600" height="800"><tr><td><img src="bar.jpg" width="600" height="800"/></td></tr></table> 
     </td> 

     <td height="37" valign="top"><img style="float:left;" border="0" src="foo.png" width="37" height="37"/></td> 

     </tr> 

     <!-- This row doesnt fill the vertical space on IE7 //--> 
     <tr> 
     <td valign="top" bgcolor="#112233">&nbsp;</td> 
     <td valign="top" bgcolor="#112233">&nbsp;</td> 
     </tr> 

    </table> 
    </body> 

번째 행 못해 제대로합니다 (ROWSPAN = "2"를 통지) 제 행 중간 컬럼에 의해 생성 된 수직 방향의 공간을 채우기 다음과 같이 단편이다. 대신 첫 번째 행 1, 3 열이 나는 37에 자신의 높이를 설정하더라도

alt text http://i34.tinypic.com/f1bfrs.jpg

편집 ... 이미지 아래 IE7과 Firefox3에서 일어나는 보여줍니다 아래로 확장 다음에 HTML의 문서 형식을 추가 코드 스 니펫. 스크린 샷을 추가했습니다.

어떤 도움 감사합니다, 감사합니다 :)

+0

을 사용하고있는 문서 선언? –

+0

Chris : 방금 코드 스니 피트에 추가했습니다. – QAZ

답변

2

당신은 이런 식으로 무엇을하려고하는 경우 : 당신이

<!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></head> 
    <body bgcolor="#AA5566" > 
    <table width="100%" border='1'> 

     <tr> 

     <td valign="top"> 
      <table bgcolor="#112233" height="37" width='100%'><tr><td>asdf</td></tr></table><br /> 
      Other content 
     </td> 

     <td width="600" rowspan="2" > 
      <table width="600" height="800"><tr><td>asdf</td></tr></table> 
     </td> 

     <td valign="top"> 
      <table bgcolor="#112233" height="37" width='100%'><tr><td>asdf</td></tr></table><br /> 
      Other content 
     </td> 

     </tr> 



    </table> 
    </body> 
0

나는 그 일이 왜 아주 확실하지 않다. 달성하고자하는 레이아웃은 무엇입니까? 실제로 테이블이되어야합니까? 페이지를 테이블로 레이아웃해서는 안되며 실제 테이블 형식의 데이터에만 사용해야합니다.

div를 사용 해본 적이 있습니까?

+0

설명을 돕기 위해 스크린 샷을 추가했습니다. 네, 아마도 DIV를 사용해야합니다.하지만이 버그를 고칠 수만 있다면 다시 작성하지 않아도됩니다. – QAZ

0

validator을 통해 던져서 조금 더 가깝습니다.

실제로 - 당신이보고있는 것은 IE의 정상적인 동작입니다 : 기본 테이블에 border = "1"을 추가하면 조금 더 명확하게 표시됩니다.

3

정답은 다음과 같습니다. 테이블을 사용하여 페이지 레이아웃을 지정하지 마십시오.

기술적 인 대답은 테이블 셀이하는 일, 즉 사용하는 코드 구조로 문제를 해결할 수 없다는 것입니다.

해킹 된 대답은 왼쪽과 오른쪽의 셀을 정확히 37px로 높이면 좌우 셀에 2 개의 중첩 테이블을 추가해야한다는 것입니다.