고정 된 테이블 높이와 가변 수의 행으로 테이블 라인을 스트레칭하지 않습니까?

StackOverflow https://stackoverflow.com/questions/1655982

  •  11-09-2019
  •  | 
  •  

문제

HTML 양식의 테이블이 있습니다. 광학적 이유로 고정 된 높이가 있습니다. 테이블의 행 수는 사용 가능한 양식 필드 수에 따라 다릅니다.

문제 : 행이 거의 없으면 모든 행이 수직으로 늘어나서 입력 요소 사이의 공간을 증가시킵니다.

데이터 행에 (가짜) 고정 높이를 제공함으로써 이것을 피할 수있었습니다. 고정 높이가 없기 때문에 (상대 글꼴 크기, 접근성)가 없기 때문에 그 접근법이 마음에 들지 않습니다. 예를 들어 IE9가 문자 그대로 셀 높이를 취하기로 결정합니다.

어떡해? 나는 마지막 (빈) 행을 가지고 있지만 모든 "사용 가능한"공간을 자동으로 차지할 수 있도록 거기에 무엇을 넣어야하는지 전혀 모른다.

도움이 되었습니까?

해결책 3

나는 이것이 할 수 없다고 생각한다.

다른 팁

높이가없는 테이블을 고정 된 높이의 DIV에 넣는 테이블 (테두리? bgcolor?)을 모방합니다.

그건 그렇고, 그냥하고 있습니다 tbody { display: inline; } 빈 행 대신 모든 실제 브라우저에서 작동합니다. 아니요, MSIE는 아닙니다. 그만큼 tbody 요소는 MSIE에 많은 단점이 있습니다. 또한 능력이 부족합니다 overflow: scroll; 고정 헤더가있는 스크롤 가능한 테이블이있는 것이 좋습니다.

마지막 빈 행에 대해 셀 높이를 100%로 설정할 수 없을 것입니다. 아마도 그 마지막 행은 나머지 고정 된 공간을 차지하게 될 것입니다.

예, 테이블 기반 웹 사이트는 나이가 지나지 만 데이터를 표시하려면 여전히 테이블이 필요합니다. 사실 나는 이것이 테이블 셀 자체에서는 할 수 없다는 점에 동의해야하지만, 우리가 패션 할 수있는 것이 있습니다.

내부에 데이터를 감싸십시오 td 세포로 a div 그리고 스타일 div 당신이 원하는 높이에 overflow 속성 hidden.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top