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

제품 지원
1

안녕하세요,

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

이미지는 2012년부터 2021년까지 단계별 16세 이상 1급 면허 소지자 총 수를 보여주는 테이블을 나타냅니다. 테이블에는 전체 학습자 데이터, 오픈 매칭/ID 데이터, 오픈 매칭/ID 데이터, 오픈 매칭/ID 데이터 열과 각 항목의 백분율이 포함되어 있습니다. (AI가 캡션을 생성함)
이미지는 2012년부터 2021년까지 단계별 16세 이상 1급 면허 소지자 총 수를 보여주는 테이블을 나타냅니다. 테이블에는 전체 학습자 데이터, 오픈 매칭/ID 데이터, 오픈 매칭/ID 데이터, 오픈 매칭/ID 데이터 열과 각 항목의 백분율이 포함되어 있습니다. (AI가 캡션을 생성함)1274×1258 75.3 KB

수정: 여기는 페이지 링크입니다

CSS를 사용하여 테이블 테두리를 생성하고 테이블 너비를 최대화하려고 시도했지만, 게시된 페이지에서는 테마 컴포넌트가 표시되지 않는 것 같습니다 :smiling_face_with_tear:

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

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

2

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

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

3

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

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

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

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

아래는 해당 코드입니다:

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

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

image
image2807×1076 261 KB

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

image
image1455×1465 197 KB