HTML 표 : 열에 대해 동일한 너비 유지

HTML 표 : 열에 대해 동일한 너비 유지

---

여러 열 그룹이있는 테이블이 있습니다. 테이블이 내 페이지보다 크기 때문에 페이지에 맞게 이러한 그룹 중 일부를 표시하거나 숨기는 컨트롤이 있습니다. 초기 테이블은보기 좋습니다. 모든 열은 그룹 내에서 너비가 거의 같습니다. 하지만 그룹을 숨기면 열의 너비가 더 이상 같지 않아보기가 나빠 보입니다.

예 : http://www.reviews-web-hosting.com/companies/apollohosting.html (깨진 링크)

지금까지 테이블은 괜찮아 보입니다. >>를 클릭하십시오. "전자 상거래 프로"의 첫 번째 열은 "전자 상거래 프로"의 다른 열보다 훨씬 넓습니다. 이상하게 보입니다. <<를 클릭하십시오. 이번에는 "값"아래의 첫 번째 열이 너무 넓습니다. 적어도 Firefox에서는.

나는 사용하려고 노력했다

<colgroup><col /><col span="5" />...

하지만 운이 없습니다. col을 style = "display : none"으로 설정하면 열 세트가 계속 표시됩니다.

그룹과 동일한 너비로 열을 유지하는 HTML / CSS 팁이 있습니까?

편집하다:

• 열을 숨기려면 가시성을 사용해야합니다.
• 이제 크기가 잘 조정되는 것 같습니다. 이유를 모르겠습니다.

---

table-layout: fixed;테이블에 스타일을 설정하면 브라우저의 자동 열 크기 조정을 무시할 수 있습니다. 그런 다음 브라우저는 표의 첫 번째 행에있는 셀 너비를 기준으로 열 너비를 설정합니다. 당신의 변경 <thead>에을 <caption>하고 제거 <td>의 셀에 대한 다음 설정 고정 폭을 그것의 내부를하고 <tbody>.

---

이 스타일을 td : width : 1 %;

---

귀하의 경우에는 3 개의 열만 표시하므로 다음과 같습니다.

Name    Value       Business
  or
Name    Business    Ecommerce Pro

3 개의 너비를 모두 33.3 %로 설정하지 않는 이유는 무엇입니까? 한 번에 3 개만 표시되므로 브라우저 는 모두 비슷한 너비로 렌더링해야합니다.

---

글쎄, 왜 당신은 (사이드 바를 제거하고) 테이블을 짜서 표시 / 숨기기 효과가 없도록하지 않습니까? 지금은 이상하게 보입니다. 테이블이 너무 튼튼합니다.
그렇지 않으면 scunliffe의 제안이 그것을해야한다고 생각합니다. 또는 원하는 경우 표의 정확한 너비를 설정하고 표 셀의 백분율 또는 픽셀 너비를 설정할 수 있습니다.

참고 URL : https://stackoverflow.com/questions/570154/html-table-keep-the-same-width-for-columns