2

IE8에서 표의 열 구분 기호를 표시하려고합니다. 나는 크롬과 파이어 폭스에서 잘 작동하는 CSS를 사용하고 있지만, IE8에서는 검은 칸 구분 기호가있는 표 셀의 구석이 다르게 나타납니다. 아래 이미지에서 차이점을 볼 수 있습니다. 첫 번째 이미지는 내가 원하지 않는 결과를 보여주는 IE8에서 가져온 것이고 두 번째 이미지는 내가 테이블을 표시하는 방법을 보여주는 Chrome에서 가져온 것입니다. IE8 셀 모서리 경계

소스는 다음과 같습니다

, 당신은 또한 http://jsbin.com/obava4/2/edit에서 편집 할 수 있습니다 :

table.testresults 
{ 
    border-collapse:collapse; 
} 


table.testresults td { 
    padding: 3px; 
    border-style:solid;  
    border-width: 4px; 
    border-color:lightgray; 
    font-size: 8pt; 
    font-family: Arial; 
    font-weight:400; 
} 

table.testresults *.borderleft { 
    border-left-color: black; 
    border-left-style: solid; 
    border-left-width: 5px; 

} 

table.testresults th { 
    font-size: 0.7em; 
    font-family: Arial; 
    padding: 3px; 
    spacing:0px; 
    border-bottom-color: lightgray; 
    border-style:solid; 
    border-width: 4px; 
    border-color:lightgray; 
} 

</style> 
<meta charset=utf-8 /> 
<title>JS Bin</title> 
</head> 
<body> 


</head> 

<body> 
<table class="testresults"> 
      <col id="col1"><col id="col2"><col id="col3"> 
      <tr class="currenv"> 
      <th class="corrcorrenv borderleft" align="left" colspan="1">CORR of COR</th> 
      <th class="correnv borderleft" align="left" colspan="1">CORR</th> 

      </tr> 
     <tr class="currenv"> 
     <th width="50px" class="resultheader borderleft" align="left">Result</th> 
     <th class="nowrap">Age &nbsp;&nbsp;&nbsp;</th> 
     </tr> 
     <tr> 
      <td class="borderleft" TestResultsID="">Pased</td> 
    <td>row.ARAge</td> 


</tr> 
    </table> 
</body> 
</html> 


</body> 
</html> 

답변

1

을 난 두려워 그것을 IE는 테이블 셀을 렌더링 다만 방법 테두리. 또는 div에 셀 내용을 래핑하고 div에 테두리를 넣으려고해도되지만 div가 표 셀을 채우는 것은 상당히 어려운 일입니다 - 참조 this 그래서 질문이 있습니다.

+0

고마워요 토마스, 그게 제가 두려웠 던 것입니다. – bjwbell

+0

IE9에서 문제를 해결했을 것이라고 생각합니다. 오 잘. –