미디어위키:Mobile.css: 두 판 사이의 차이

2025년 2월 21일 (금) 18:34 판

/* 여기의 모든 CSS는 모바일 사이트를 사용하는 사용자에게 로드됩니다 */

/* mw-collapsible 테이블이 화면을 넘지 않도록 조정 */
.mw-collapsible {
    width: 100% !important;
    max-width: 100%;
    text-align: left;
    background: #f9f4e6;
    border: 1px solid #0a0a0a;
    padding: 10px;
    font-size: 16px;
    word-wrap: break-word;
    overflow-wrap: break-word;
    overflow-x: hidden; /* 강제로 가로 스크롤 막음 */
}

/* mw-collapsible 내용이 화면을 넘지 않도록 조정 */
.mw-collapsible-content {
    display: block !important;
    max-width: 100%;
    overflow-x: hidden; /* 강제로 가로 스크롤 막음 */
}

/* 표 크기 자동 조정 */
.mw-collapsible table {
    table-layout: auto; /* 내용에 따라 자동 조정 */
    width: 100% !important;
    max-width: 100%;
    word-break: break-word;
    overflow-x: auto;
}

/* <poem> 태그가 화면을 넘지 않도록 설정 */
.mw-collapsible poem {
    display: block;
    white-space: normal !important; /* 강제 줄바꿈 적용 */
    word-break: break-word;
    overflow-wrap: break-word;
}

/* 모바일에서 표가 넘칠 경우 대비 */
@media screen and (max-width: 768px) {
    .mw-collapsible {
        display: block !important;
        overflow-x: hidden;
    }
    .mw-collapsible table {
        display: block;
        overflow-x: auto;
        white-space: normal;
    }
}