셀 높이가 웹킷 브라우저에서 무시되는 것임

Question

tbody와 thead 하이츠로 놀려고하는데, 다른 브라우저와 달리 웹킷이 예상대로 동작하지 않습니다.

나는 실제로 td 높이를 설정했습니다.

Here is 내가 무엇을 말하고에 대한

질문입니다 - 브라우저가 나는 그냥 같은 항목을 렌더링 할 수있는 방법, 웹킷 렌더링이 제대로 경우에도 제대로 작동하고있는 비 웹킷 브라우저에서?

Answer 1

TABLE 및 TD의 높이를 모두 설정하지 마십시오. 하나를 선택하십시오.

Answer 2

셀의 경우 높이 대신에 최소 높이 또는 둘 다를 사용하십시오. 당신이 내부 세포의 높이를 알고있는 경우

table { 
    border: 1px solid red; 
    height: 200px; 
    width: 400px; 
} 
thead td { 
    min-height: 10px; 
} 

tbody { 

} 

tbody td { 
    background: pink; 
    min-height: 10px; 
} 

Answer 3

, 당신은 단지 테이블 후 의사 요소를 삽입 할 수 : http://dabblet.com/gist/4332648

그러나,이 경우 paddings 등 :

같은 더 나은 솔루션이있다

그럼 행의 개수를 모르는 척하고 표의 높이를 알아 보겠습니다. 우리가 어떻게 든 그 자리를 예약 할 수 있다면이 테이블을 절대 위치로 만들 수 있고 매우 높은 의사 요소를 삽입하고 clip을 사용하여 불필요한 공간을 제거하십시오 : http://dabblet.com/gist/4332690. 국경이 필요하다면 또 다른 의사 요소가 도움이 될 것입니다 - http://dabblet.com/gist/4332702.

나는 당신이 원하는 것과 다른 이상적인 해결책을 모방하기위한 해킹 만있을 수 있다는 것을 두려워한다.