TR의 최대 TD를 기준으로 높이 설정

Question

HTML 테이블을 만들고 Internet Explorer 11을 사용하고 있습니다. 각 TR에는 다양한 크기의 요소가 포함 된 여러 개의 TD가 있습니다. IE DOM Explorer를 통해 페이지를 검사하고 무슨 일이 일어 났는지 생각합니다. 일반적으로 텍스트 영역은 CSS 당 최대 167px이지만 다른 td 요소 중 하나가 더 커질 수 있습니다 (예 : td1 = 300px). 내가 가진 문제는 텍스트 영역을 300px로 채우고 싶다는 것입니다. 나는 높이가 여전히 167px 인 td id = "td3"에서 상속 받고 있음을 알 수 있습니다. 내가 td id = "td3"을 얻을 수있는 방법은 tr에서 가장 큰 형제 td에서 높이를 얻는 것입니다.

html로 내가 크롬 내가 원하는 것을하지만 표준

을 준수 솔루션을 선호 알

.ta{ 
    height: 100%; 
    min-height: 167px 
} 

---

한 가지가이

<thead> 
    ... 
</thead> 
<tbody> 
    <tr> 
     <td id="td1">[Dynamic Text1]</td> 
     <td id="td2">[Dynamic Text2]</td> 
     <td id="td3"><textarea class="ta"></textarea></td> 
    </tr> 
    <tr> 
    ... 
    </tr> 
    <tr> 
    .... 
</tbody> 

CSS 같은 형태

Answer 1

HTML 오류가 없는지 확인하십시오 (w3.org 유효성 검사기를 사용하여 유효성을 검사 해보십시오). 이는 종종 다른 렌더링 엔진 사이에서 발생하는 디스플레이 버그의 원인입니다.

td { 
    min-height: 200px; 
    background: lightblue; 
    vertical-align: top; 
} 

textarea { 
    display: block; 
    height: 100%; 
    min-height: 50px; 
} 

http://jsfiddle.net/Kg3P5/2/