고정 테이블 너비 테이블 레이 아웃 : 고정

테이블이 화면을 채우도록하기 위해 (남은 빈 영역), 너비 속성은 종종 100%로 정의되며 셀은 또한 백분율로 정의됩니다.

그러나 이것은 문제를 일으킬 것입니다. 셀의 텍스트가 너비 제한을 초과하면 자동으로 선을 랩핑하고 높이가 자동으로 증가하여 전체 테이블의 고르지 않은 스타일이 매우 추악합니다.

이에 대한 쉬운 해결책은 텍스트 라인 브레이크를 비활성화하는 것입니다. 흰색 공간 : Nowrap; 오버플로 : 숨겨진;

너무 쉽습니다! 그러나 그 효과는 여전히 예상치 못한 일입니다. 텍스트는 한 줄에 표시되고 너비가 자동으로 넓어지고 부모 컨테이너를 초과하여 오버플로가 전혀 영향을 미치지 않습니다!

무슨 일이야? 백분율의 이유입니까? 그러나 정적 고정 너비를 사용하면 테이블의 유연성이 손실됩니다.

따라서 궁극적 인 솔루션은 아무런 노력없이 발견되었습니다. 고정 테이블 너비 : 테이블 레이 아웃 : 고정;

그건 그렇고, 나는 간단한 렌더링을 만들었습니다. 다음을 참조하십시오.