사용자:Lunaris/common.css

참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.

• 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
• 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
• 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.

/* PC용 벡터 스킨을 모바일 가로 폭에 딱 맞추는 CSS */
@media screen and (max-width: 980px) {
    /* 1. 전체 화면 좌우 여백 및 넘침 제거 */
    html, body {
        max-width: 100% !important;
        overflow-x: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 2. 본문 박스를 화면 가로 폭에 꽉 채우기 */
    #content {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 10px !important;
        border-left: none !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 3. 왼쪽 사이드바 메뉴를 화면 맨 아래로 내리기 */
    #mw-panel {
        position: relative !important;
        padding-top: 20px !important;
        width: 100% !important;
        margin-left: 10px !important;
        clear: both !important;
    }

    /* 4. 상단 헤더(검색창, 메뉴) 영역 압축 */
    #mw-head {
        position: relative !important;
        width: 100% !important;
    }
    #left-navigation, #right-navigation {
        float: none !important;
        margin-left: 0 !important;
    }

    /* 5. 가로로 긴 표(Table)나 설정창 강제 스크롤 처리 */
    .mw-body-content table, pre, .mw-htmlform-matrix {
        display: block !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        white-space: nowrap;
    }
    
    /* 6. 배경 영역 정돈 */
    #mw-page-base, #mw-head-base {
        display: none !important;
    }
}