# 게시된 페이지에서 넓은 테이블이 눌려 보입니다

**URL:** https://meta.discourse.org/t/wide-tables-become-squished-in-published-pages/319580
**Category:** Support
**Tags:** page-publishing
**Created:** [8월 1, 2024, 1:42오전 UTC](https://meta.discourse.org/t/wide-tables-become-squished-in-published-pages/319580 "2024-08-01T01:42:59Z")
**Posts on this page:** 4
**Page:** 1

<div class="post-metadata">

### Author: ![rachel-statsnz](https://avatars.discourse-cdn.com/v4/letter/r/8edcca/32.png) [@rachel-statsnz](https://meta.discourse.org/u/rachel-statsnz)
#### Post date: [8월 1, 2024, 1:42오전 UTC](https://meta.discourse.org/t/wide-tables-become-squished-in-published-pages/319580/1 "2024-08-01T01:42:59Z")

</div>

안녕하세요,

게시된 페이지의 외관을 개선하려고 노력해 왔는데, 넓은 테이블이 매우 눌려 보이는 것 같습니다.

 ![이미지는 2012년부터 2021년까지 단계별 16세 이상 1급 면허 소지자 총 수를 보여주는 테이블을 나타냅니다. 테이블에는 전체 학습자 데이터, 오픈 매칭/ID 데이터, 오픈 매칭/ID 데이터, 오픈 매칭/ID 데이터 열과 각 항목의 백분율이 포함되어 있습니다. (AI가 캡션을 생성함)](https://global.discourse-cdn.com/meta/original/4X/5/2/e/52e31a3a8e551b23cd6af4ac043705e10aa54219.png)  
수정: 여기는 [페이지 링크](https://idcommons.discourse.group/pub/driver-licence-status)입니다

CSS를 사용하여 [테이블 테두리를 생성](https://meta.discourse.org/t/adding-a-table-to-your-post-using-markdown/66544/6?)하고 [테이블 너비를 최대화](https://meta.discourse.org/t/adding-a-table-to-your-post-using-markdown/66544/21?u)하려고 시도했지만, 게시된 페이지에서는 [테마 컴포넌트가 표시되지 않는 것 같습니다](https://meta.discourse.org/t/adding-discotoc-to-published-pages/246402/3) 🥲

넓은 테이블을 더 보기 좋게 만드는 방법에 대해 아이디어가 있으신가요?

수정 2: 페이지 게시 뷰가 저장되나요?

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [8월 1, 2024, 9:43오전 UTC](https://meta.discourse.org/t/wide-tables-become-squished-in-published-pages/319580/2 "2024-08-01T09:43:35Z")

</div>

CSS는 게시된 페이지에서도 계속 작동해야 합니다. 작동하지 않는 것은 JavaScript 같은 것들뿐입니다.

물론 특정 클래스는 있습니다.

---

<div class="post-metadata">

### Author: ![Steven](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/steven/32/187890_2.png) [@Steven](https://meta.discourse.org/u/Steven)
#### Post date: [8월 1, 2024, 12:17오후 UTC](https://meta.discourse.org/t/wide-tables-become-squished-in-published-pages/319580/3 "2024-08-01T12:17:32Z")

</div>

게시된 페이지와 표에 두 가지 문제가 있습니다.

content-wrapper가 다소 작아 보입니다.

CSS의 첫 번째 부분에서 max-width 값을 조정해 보세요. 값을 변경해도 반응형 레이아웃은 유지됩니다.

그리고 표의 width:100%가 작동하지 않는 것 같습니다. 게시된 페이지의 CSS가 약간 다르기 때문일 수 있습니다. 이를 수정하기 위해 커스텀 CSS에 두 번째 부분을 추가했습니다.

아래는 해당 코드입니다:

```css
.published-page {
  .published-page-content-wrapper {
    max-width: 1200px;
    width: 100%;
  }
  .md-table .table {
    width: 100%;
  }
}

```

---

<div class="post-metadata">

### Author: ![rachel-statsnz](https://avatars.discourse-cdn.com/v4/letter/r/8edcca/32.png) [@rachel-statsnz](https://meta.discourse.org/u/rachel-statsnz)
#### Post date: [8월 1, 2024, 9:30오후 UTC](https://meta.discourse.org/t/wide-tables-become-squished-in-published-pages/319580/4 "2024-08-01T21:30:22Z")

</div>

와, 감사합니다! 코드를 적용하니 페이지가 훨씬 좋아졌네요! 그런데 테이블이 여전히 약간 눌려 보입니다. 다른 의견이 있을까요?

 ![image](https://global.discourse-cdn.com/meta/original/4X/3/d/7/3d7a6f3441ab35cb7886f99eb1a4d78eaad8c88b.png)

플랫폼에서 보이는 모습은 다음과 같습니다:

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/7/2/b7227021534cacf899e0ee3d650a6362ac2f9660.png)