Update app.py

app.py

@@ -501,17 +501,32 @@ with gr.Blocks() as demo:
 # 5. Application Styling (CSS)
 # ==========================================
 css = """
+/* ----------------------------------------------------
+   [1] 기본 설정 (7열 이상 다중 열 기준)
+   - 열이 많을 경우 100%를 넘어서 자연스럽게 스크롤되도록 설정
+---------------------------------------------------- */
 table { 
-    table-layout: fixed !important; 
-    width: 100% !important; 
+    table-layout: auto !important; 
+    width: max-content !important; 
+    min-width: 100% !important;
 }
 
-/* 7열 이상의 다중 열에 대한 기본 Fallback (가로 스크롤 허용) */
 th, td {
-    min-width: 150px;
+    min-width: 150px; /* 열이 많아도 글자가 깨지지 않게 최소 너비 방어 */
+}
+
+/* ----------------------------------------------------
+   [2] 2, 4, 5, 6열 조건부 설정 (지정하신 비율 완벽 복구)
+   - 해당 열 개수일 때만 고정 레이아웃(fixed) 적용
+---------------------------------------------------- */
+table:has(th:nth-last-child(2):first-child),
+table:has(th:nth-last-child(4):first-child),
+table:has(th:nth-last-child(5):first-child),
+table:has(th:nth-last-child(6):first-child) {
+    table-layout: fixed !important;
+    width: 100% !important;
 }
 
-/* [해결 2] 작성하셨던 기존 2~6 컬럼 비율 완전 복구 (min-width 무시 설정 추가) */
 /* 2컬럼 */
 table th:nth-last-child(2):first-child, table td:nth-last-child(2):first-child { width: 15% !important; min-width: 0 !important; } 
 table th:nth-last-child(1), table td:nth-last-child(1) { width: 85% !important; min-width: 0 !important; }
@@ -537,7 +552,9 @@ table th:nth-child(4):nth-last-child(3), table td:nth-child(4):nth-last-child(3)
 table th:nth-child(5):nth-last-child(2), table td:nth-child(5):nth-last-child(2) { width: 8% !important; min-width: 0 !important; } 
 table th:nth-child(6):nth-last-child(1), table td:nth-child(6):nth-last-child(1) { width: 26% !important; min-width: 0 !important; }
 
-/* 기본 테이블 & 스크롤 설정 */
+/* ----------------------------------------------------
+   [3] 데이터프레임 및 헤더 기본 스크롤/텍스트 설정
+---------------------------------------------------- */
 thead th { 
     font-size: 18px !important;
     position: sticky;
@@ -548,7 +565,7 @@ thead th {
 .dataframe { 
     max-height: none !important; 
     overflow-y: visible !important; 
-    overflow-x: auto !important;
+    overflow-x: auto !important; /* 좌우 스크롤바 허용 */
     display: block;
 } 
 .dataframe > div { 
@@ -558,7 +575,7 @@ thead th {
 td { 
     font-size: 18px !important;
     white-space: pre-wrap !important;
-    word-break: break-word !important;
+    word-break: keep-all !important; /* 알파벳이 하나씩 찢어지는 현상 방지 */
     line-height: 1.6; 
     padding: 10px; 
     vertical-align: top !important;