Common.css: 두 판 사이의 차이
CABAL WIKI
편집 요약 없음 |
편집 요약 없음 |
||
1번째 줄: | 1번째 줄: | ||
/* 이 CSS 설정은 모든 스킨에 적용됩니다 */ | /* 이 CSS 설정은 모든 스킨에 적용됩니다 */ | ||
/* | /* 데스크톱: 목차를 본문 왼쪽에 고정하되 약간 여유를 둬서 붙임 */ | ||
#toc { | #toc { | ||
position: fixed; | position: fixed; | ||
top: 100px; | top: 100px; | ||
left: | left: 240px; /* 왼쪽 사이드바 크기에 맞춰 조정 */ | ||
max-height: 80vh; | max-height: 80vh; | ||
overflow: auto; | overflow: auto; | ||
11번째 줄: | 11번째 줄: | ||
border: 1px solid #ccc; | border: 1px solid #ccc; | ||
z-index: 999; | z-index: 999; | ||
width: 250px; | |||
font-size: 0.9em; | |||
} | } | ||
/* 모바일 | /* 본문 콘텐츠와 겹치지 않도록 여백 확보 */ | ||
#mw-content-text { | |||
margin-left: 520px; /* toc 너비 + 여유 공간 */ | |||
} | |||
/* 모바일: 목차 고정 해제 및 기본 위치로 복원 */ | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
#toc { | #toc { | ||
22번째 줄: | 29번째 줄: | ||
padding: 0; | padding: 0; | ||
border: none; | border: none; | ||
width: auto; | |||
} | |||
#mw-content-text { | |||
margin-left: 0; | |||
} | } | ||
} | } |
2025년 7월 10일 (목) 03:58 판
/* 이 CSS 설정은 모든 스킨에 적용됩니다 */ /* 데스크톱: 목차를 본문 왼쪽에 고정하되 약간 여유를 둬서 붙임 */ #toc { position: fixed; top: 100px; left: 240px; /* 왼쪽 사이드바 크기에 맞춰 조정 */ max-height: 80vh; overflow: auto; background-color: #f9f9f9; padding: 1em; border: 1px solid #ccc; z-index: 999; width: 250px; font-size: 0.9em; } /* 본문 콘텐츠와 겹치지 않도록 여백 확보 */ #mw-content-text { margin-left: 520px; /* toc 너비 + 여유 공간 */ } /* 모바일: 목차 고정 해제 및 기본 위치로 복원 */ @media (max-width: 768px) { #toc { position: static !important; max-height: none; overflow: visible; background-color: transparent; padding: 0; border: none; width: auto; } #mw-content-text { margin-left: 0; } }